heatmap legend

by Gabriel de Souza

HTML

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/regression/1.3.0/regression.min.js"></script>

<script id='sap-ui-bootstrap' type='text/javascript' src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js' data-sap-ui-libs="sap.m, sap.viz" data-sap-ui-theme="sap_bluecrystal">



</script>
<script id="myXml" type="text/xmldata">
    <mvc:View xmlns:core = "sap.ui.core"
    xmlns:mvc = "sap.ui.core.mvc"
    xmlns = "sap.m"
    controllerName = "myController"
    displayBlock = "true" > 
    	<App> 
    		<Page id = "p" title = "Purchases"> 
        </Page>
	  	</App> 
    </mvc:View>
</script>
<body class='sapUiBody'>
    <div id='content'></div>
</body>

JavaScript

sap.ui.controller("myController", {
    onInit: function() {

        this.oPage = this.byId("p");
        //Set model for system growth chart
        var oData = {
            "results": [{
                "Country": "Italy",
                "Penetration": "0.12"
            }, {
                "Country": "USA",
                "Penetration": "0.68"
            }, {
                "Country": "Portugal",
                "Penetration": "0.48"
            }, {
                "Country": "Spain",
                "Penetration": "0.97"
            }, {
                "Country": "Germany",
                "Penetration": "0.30"
            }]
        };
        
        this._chartModel = new sap.ui.model.json.JSONModel(oData);
        this.getView().setModel(this._chartModel, 'SalesByCountry');

        //Create dimension 
        var aDimensionDefinitions = [{
            name: "Country",
            value: "{Country}"
        }];
        var feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "categoryAxis",
            'type': "Dimension",
            'values': ["Country"]
        });
        
        var aMeasuresDefinitions = [];
        var aMeasureValues = [];
        var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "color",
            'type': "Measure"
        });
        var sMeasureUnit = "%";
        var oMeasure = new sap.viz.ui5.data.MeasureDefinition({
            name: 'Penetration',
            value: {
                path: 'Penetration'
            }
        });
        aMeasuresDefinitions.push(oMeasure);
        aMeasureValues.push('Penetration');
        feedValueAxis.setValues(aMeasureValues);
        // create a VizFrame
        var oVizFrame = new sap.viz.ui5.controls.VizFrame({
            vizType: "heatmap"
        });

        oVizFrame.setModel(this._chartModel);
        //Create dataSet
        var oDataset = new sap.viz.ui5.data.FlattenedDataset({
           ...