Skip to Content
0

UI5 Waterfall Chart Status Flip Issue with JSON Model

Mar 28, 2017 at 06:50 AM

47

avatar image

I have created a waterfall chart in UI5 using Viz library.

JSON data for Waterfall Chart is as below:

{ "Rowsets" : { 
"DateCreated" : "2017-03-27T19:20:57", "Version" : "15.1 SP2 Patch 5 (Jul 20, 2016)", "StartDate" : "2017-03-27T18:20:55-0500", "EndDate" : "2017-03-27T19:20:55-0500", "CachedTime" : "", 
"Rowset" : [ 
{ "Columns" : { 
"Column" : [ 
{ "Name" : "Status", "SourceColumn" : "Status", "Description" : "", "SQLDataType" : 1, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
{ "Name" : "Hours", "SourceColumn" : "Hours", "Description" : "", "SQLDataType" : 8, "MinRange" : 1.0, "MaxRange" : 1.0 }, 
{ "Name" : "Type", "SourceColumn" : "Type", "Description" : "", "SQLDataType" : 1, "MinRange" : 1.0, "MaxRange" : 1.0 } ] }, 
"Row" : [ 
{ "Status" : "Full Production Time", "Hours" : 7.85, "Type" : "null" }, 
{ "Status" : "Quality Loss", "Hours" : 0.15, "Type" : "null" }, 
{ "Status" : "Net Run Time", "Hours" : 8.00, "Type" : "subtotal:2" }, 
{ "Status" : "Performance Loss", "Hours" : 69.00, "Type" : "null" }, 
{ "Status" : "Run Time", "Hours" : 77.00, "Type" : "subtotal:2" }, 
{ "Status" : "Unplanned DownTime", "Hours" : 76.00, "Type" : "null" }, 
{ "Status" : "Scheduled Time", "Hours" : 153.00, "Type" : "subtotal:2" }, 
{ "Status" : "Planned DownTime", "Hours" : 15.00, "Type" : "null" }, 
{ "Status" : "Available Time", "Hours" : 168.00, "Type" : "subtotal:2" }, 
{ "Status" : "Total Time", "Hours" : 168.00, "Type" : "subtotal:1" } ]
 } ]
 }
 }

Waterfall Chart:


The View of the waterfall chart:

<l:FixFlex id='chartFixFlex' minFlexSize="250">
<l:flexContent>
<viz:Popover id="idPopOver">
</viz:Popover>
<viz:VizFrame id="idVizFrame" uiConfig="{applicationSet:'fiori'}"
height='100%' width="100%" vizType='horizontal_waterfall'>
<viz:dataset>
<viz.data:FlattenedDataset
data="{/Rowsets/Rowset/0/Row}">
<viz.data:dimensions>
<viz.data:DimensionDefinition name="Type" value="{Type}" />
<viz.data:DimensionDefinition name="Status" value="{Status}" />
</viz.data:dimensions>
<viz.data:measures>
<viz.data:MeasureDefinition name="Hours" value="{Hours}" />
</viz.data:measures>
</viz.data:FlattenedDataset>
</viz:dataset>
<viz:feeds>
<viz.feeds:FeedItem uid="valueAxis" type="Measure" values="Hours" />
<viz.feeds:FeedItem uid="categoryAxis" type="Dimension" values="Status" />
<viz.feeds:FeedItem uid="waterfallType" type="Dimension" values="Type" />
</viz:feeds>
</viz:VizFrame>
</l:flexContent>
</l:FixFlex>

The controller of the waterfall chart:

var sURL = ** URL whihc brings bak above mentioned JSON Data **
var oChartModel = new sap.ui.model.json.JSONModel;
oChartModel.loadData(sURL,{},false);
var oVizFrame = this.oVizFrame = this.byId("idVizFrame");
oVizFrame.setVizProperties({
plotArea : {
dataLabel : {
visible : true
}
},

valueAxis : {

title : {
visible : true
}
},
categoryAxis : {
title : {
visible : true
}
},

legend: {
                    title: {
                        visible: false
                    },
                    label: {
                        text: {
                              positiveValue: "Hours"
                        }
                    }
},

title : {
visible : true,
text : 'Waterfall Chart'
}
});
oVizFrame.setModel(oChartModel);

Now, the chart looks ok and functioning fine. But I got the requirement that the chart needs to show statuses in reverse order - basically all the statuses should flip. Total Time should come at the top and Full Production should come at the bottom.

As per my logic, in waterfall chart every status is subtotal of above few statuses depending upon the condition as shown in JSON Data. So now to flip the statuses, I am not able to figure out how should my JSON data should look like so that statuses appear in reverse order and a correct format.

Any feedback or suggestions?

Regards

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

0 Answers