<!DOCTYPE HTML>
<html>

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta http-equiv='Content-Type' content='text/html;charset=UTF-8' />

  <script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js" 
          id="sap-ui-bootstrap" 
          data-sap-ui-libs="sap.m,sap.viz" 
          data-sap-ui-resourceroots='{"view": "./"}' 
          data-sap-ui-theme="sap_belize" 
          data-sap-ui-xx-bindingSyntax="complex">
  </script>

  <script>
    // Best practice would be to set this stuff up in an Component.js
    // but let's not over-complicate stuff for demonstration purposes
    
    var oModel = new sap.ui.model.json.JSONModel();
     // Load JSON in model
    oModel.loadData("salary.json");
    sap.ui.getCore().setModel(oModel);

    sap.ui.localResources("view");  //get access to view folder
    
    var app = new sap.m.App({
      initialPage: "idMain"
    });
    
    var page = sap.ui.view({
      id: "idMain",
      viewName: "view.Main",
      type: sap.ui.core.mvc.ViewType.XML
    });
    
    app.addPage(page);
    app.placeAt("content");
  </script>

</head>

<body class="sapUiBody" role="application">
  <div id="content"></div>
</body>

</html>
# Stacked Bar chart
Start axis from specific value
{
  "data": [
    { "type": "Real", "category": "cat_03", "amount": "50000" },
    { "type": "Target", "category": "cat_03", "amount": "55000" },
    { "type": "Real", "category": "cat_02", "amount": "45000" },
    { "type": "Target", "category": "cat_02", "amount": "45000" },
    { "type": "Real", "category": "cat_01", "amount": "40000" },
    { "type": "Target", "category": "cat_01", "amount": "35000" }
  ]
}
sap.ui.controller("view.Main", {

onInit: function () {
  var oVizFrame = this.getView().byId("idVizFrame");
  
  oVizFrame.setVizProperties({
    title: {
      visible: true,
      text: "Salary"
    },
    plotArea: {
      dataLabel: {
        visible: true
      }
    },
      legendGroup: {
        layout: {
          position: "bottom" //keep legend to bottom of the chart
        }
      },

      legend: {
        label: {
          style: {
            color: "red" //changes the color of legend label(eg: red or hexadecimal colors)
          }
        }
      }    
  });
  
  //set scales
  oVizFrame.setVizScales([
    {
      feed: "valueAxis",
      min: "35000"
    }
  ], {replace: true});
},

onBeforeRendering: function() {},

onAfterRendering: function() {},

onExit: function() {}

});
<sap.ui.core.mvc:View controllerName="view.Main"
    xmlns="sap.m"
    xmlns:viz="sap.viz.ui5.controls"
    xmlns:viz.feeds="sap.viz.ui5.controls.common.feeds"
    xmlns:viz.data="sap.viz.ui5.data"
    xmlns:sap.ui.core.mvc="sap.ui.core.mvc" >
    <Page title="Stacked Bar chart - start axis from specific value">
        <content>
          <viz:Popover id="idPopOver"></viz:Popover>
          <viz:VizFrame id="idVizFrame" height="50%" width="100%"
          vizType='stacked_bar'>
            <viz:dataset>
              <viz.data:FlattenedDataset data="{/data}">
                <viz.data:dimensions>
                  <viz.data:DimensionDefinition name="Salary" value="{type}" />
                  <viz.data:DimensionDefinition name="Category" value="{category}" />
                </viz.data:dimensions>
                <viz.data:measures>
                  <viz.data:MeasureDefinition name="Amount" value="{amount}"/>
                </viz.data:measures>
              </viz.data:FlattenedDataset>
            </viz:dataset>
            
            <viz:feeds>
              <viz.feeds:FeedItem uid="valueAxis" type="Measure" values="Amount"/>
              <viz.feeds:FeedItem uid="categoryAxis" type="Dimension" values="Salary"/>
              <viz.feeds:FeedItem uid="color" type="Dimension" values="Category"/>
            </viz:feeds>
          </viz:VizFrame>
        </content>
    </Page>
</sap.ui.core.mvc:View>