
The sap.viz charting library provides a set of flexible chart controls that allow to easily
representing business data in a feature rich, graphical manner.
(Probably most of you know how to build a basic chart. Do not worry this is just starting.
Something more is waiting for you. :smile: )
var oModel = new sap.ui.model.xml.XMLModel();
oModel.loadData("/XMII/Illuminator?QueryTemplate=…… var oDataset = new sap.viz.ui5.data.FlattenedDataset(); var DimensionList = new sap.viz.ui5.data.DimensionDefinition(); (Y Axis) DimensionList.setAxis(1); DimensionList.setName("Plot"); DimensionList.bindProperty("value","YTDLabel"); oDataset.addDimension(DimensionList); var MeasureListActual = new sap.viz.ui5.data.MeasureDefinition();(X Axis) MeasureListActual.setName("Actual"); MeasureListActual.bindProperty("value","YTD"); oDataset.addMeasure(MeasureListActual); var MeasureListPlan = new sap.viz.ui5.data.MeasureDefinition();(X Axis) MeasureListPlan.setName("Plan"); MeasureListPlan.bindProperty("value","YTDPlanned"); oDataset.addMeasure(MeasureListPlan); oDataset.bindData("/Rowset/Row/"); var oChartCompare = new sap.viz.ui5.Bar ({ id : "ChartCompare", width :"310px", height : "100px", dataset : oDataset }); oChartCompare.setModel(oModel); | XML structure <Rowset> <Columns>...</Columns> <Row> <YTDLabel>YTD</YTDLabel> <YTD>89966</YTD> <YTDPlanned>440320</YTDPlanned> </Row> </Rowset> |
We get Simple meaning less Bar Chart from above code :???:
|
var YAxis = oChartCompare.getYAxis(); YAxis.setVisible(true); |
var ProdLegendYTD = oChartCompare.getLegend(); ProdLegendYTD.setVisible(true); |
var ProdTooltipYTD = oChartCompare.getToolTip(); ProdTooltipYTD.setVisible(true); |
………… height : "100px", plotArea:{ drawingEffect: sap.viz.ui5.types.Bar_drawingEffect.glossy, isRoundCorner:true, colorPalette:[color1,color2] }, dataset : oDataset ………… |
var color1 = "#EAC117"; var color2 = "#38ACEC"; var color3 = "#838B83"; var color4 = "#728C00"; ………… height : "100px", plotArea:{ drawingEffect: sap.viz.ui5.types. Bar_drawingEffect.glossy, isRoundCorner:true, colorPalette:[color1,color2] }, dataset : oDataset ………… |
plotArea:{ ………………………….. }, dataLabel: { visible:true, positionPreference : true, position : sap.viz.ui5.types. Datalabel_position.outside, }, dataset : oDataset ………………………….. |
………………………….. dataLabel: { ……………………… position : sap.viz.ui5.types. Datalabel_position.outside, formatString : [["##,0"],["en-US"]] }, dataset : oDataset ………………………….. |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.