I've the code below. What I want to do is to bind my chart to a subpath of the "areas" node. For this reason I'm using the statement
data : {
path : "/areas('area1')/businessData"
}
but the code is not working.
Could you please tell me how I can do this? Which is the correct syntax?
Regards,
Simmaco
______________________________________________
<!DOCTYPE html>
<html><head>
<meta http-equiv='X-UA-Compatible' content='IE=edge' />
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<title>test</title>
<script id='sap-ui-bootstrap' type='text/javascript'
src='/sapui5/resources/sap-ui-core.js'
data-sap-ui-theme='sap_goldreflection'
data-sap-ui-libs='sap.ui.commons,sap.ui.ux3,sap.viz'></script>
<!-- add 'sap.ui.table' and/or other libraries if required -->
<script>
// some business data
var oModel = new sap.ui.model.json.JSONModel(
{
"areas": [
{
"area": "area1",
"businessData": [
{
"Country": "Canada",
"revenue": 410.87,
"profit": -141.25,
"population": 34789000
},
{
"Country": "China",
"revenue": 338.29,
"profit": 133.82,
"population": 1339724852
}
]
}
]
}
);
// A Dataset defines how the model data is mapped to the chart
var oDataset = new sap.viz.ui5.data.FlattenedDataset({
// a Bar Chart requires exactly one dimension (x-axis)
dimensions : [
{
axis : 1, // must be one for the x-axis, 2 for y-axis
name : 'Country',
value : "{Country}"
}
],
// it can show multiple measures, each results in a new set of bars in a new color
measures : [
// measure 1
{
name : 'Profit', // 'name' is used as label in the Legend
value : '{profit}' // 'value' defines the binding for the displayed value
},
{
name : 'Revenue',
value : '{revenue}'
}
],
// 'data' is used to bind the whole data collection that is to be displayed in the chart
data : {
path : "/areas('area1')/businessData"
}
});
// create a Bar chart
// you also might use Combination, Line, StackedColumn100, StackedColumn or Column
// for Donut and Pie please remove one of the two measures in the above Dataset.
var oBarChart = new sap.viz.ui5.Bar({
width : "80%",
height : "400px",
plotArea : {
//'colorPalette' : d3.scale.category20().range()
},
title : {
visible : true,
text : 'Profit and Revenue By Country'
},
dataset : oDataset
});
// attach the model to the chart and display it
oBarChart.setModel(oModel);
oBarChart.placeAt("content"); </script>
</head>
<body class='sapUiBody'>
<div id='content'></div>
</body>
</html>
<!-- user:Simmaco Ferriero --><!-- description:Charts on SAPUI5 -->