jquery - SAPUI5 VizFrame turn 90° to the left (horizontal instead of vertical) -
i using vizframe, possible turn graphic/chart 90° left or right, means horizontal alignment instead of vertical?
var chartpopover = new sap.viz.ui5.controls.popover({}); var omodel = new sap.ui.model.json.jsonmodel({ 'businessdata' : [ { "country" : "china", "profit" : 100, "forcast" : 200, "target" : 20, "revenue" : 20, "revenue2" : 20, "revenue3" : 512 }, { "country" : "japan", "profit" : 159, "forcast" : 140, "target" : 150, "revenue" : 30, "revenue2" : 100, "revenue3" : 303 }, { "country" : "india", "profit" : 129, "forcast" : 120, "target" : 100, "revenue" : 200, "revenue2" : 222, "revenue3" : 263 }, { "country" : "france", "profit" : 58, "forcast" : 60, "target" : 80, "revenue" : 116, "revenue2" : 152, "revenue3" : 113 }, { "country" : "austrilia", "profit" : 149, "forcast" : 120, "target" : 150, "revenue" : 249, "revenue2" : 292, "revenue3" : 443 }, { "country" : "sweden", "profit" : 49, "forcast" : 60, "target" : 55, "revenue" : 1449, "revenue2" : 242, "revenue3" : 243 } ] }); var odataset = new sap.viz.ui5.data.flatteneddataset({ 'dimensions' : [ { name : 'country', value : "{country}" } ], measures : [ { name : 'profit', value : '{profit}' }, { name : 'target', value : '{target}' }, { name : "forcast", value : "{forcast}" }, { name : "revenue", value : "{revenue}" }, { name : 'revenue2', value : '{revenue2}' }, { name : "revenue3", value : "{revenue3}" } ], 'data' : { 'path' : "/businessdata" } }); var ovizframe = new sap.viz.ui5.controls.vizframe("vizframe", { 'uiconfig' : { 'applicationset' : 'fiori' }, 'viztype' : 'bullet' }); ovizframe.setvizproperties({ plotarea : { colorpalette : [ 'sapuichartpalettesemanticneutral' ], gap : { visible : true } }, legend : { title : { visible : false } }, title : { visible : true, text : 'bullet (with gap enabled)' } }); ovizframe.setdataset(odataset); ovizframe.setmodel(omodel); var feedprimaryvalues = new sap.viz.ui5.controls.common.feeds.feeditem({ 'uid' : "primaryvalues", 'type' : "measure", 'values' : [ "profit" ] }), feedaxislabels = new sap.viz.ui5.controls.common.feeds.feeditem({ 'uid' : "axislabels", 'type' : "dimension", 'values' : [ "country" ] }), feedtargetvalues = new sap.viz.ui5.controls.common.feeds.feeditem({ 'uid' : "targetvalues", 'type' : "measure", 'values' : [ "target" ] }); ovizframe.addfeed(feedprimaryvalues); ovizframe.addfeed(feedaxislabels); ovizframe.addfeed(feedtargetvalues); ovizframe.attachselectdata(function(event) { var data = event.getparameter('data'); ( var = 0; < data.length; i++) { console.log(odataset.findcontext(data[i].data)) } }); var chartpopover = new sap.viz.ui5.controls.popover({}); chartpopover.connect(ovizframe.getvizuid());
i tried:
var ovizframe = sap.ui.getcore().byid("vizframe"); var properties = { 'direction' : 'vertical', // horizontal }; ovizframe.vizupdate({ 'properties' : properties, });
but without result - appreciated!
by way, yes can use rotate css not want because kind of "hack" , need stable chart no dom injections.. thanks.
thanks, zy
i'm not sure if still need it, should change type of chart "bullet" "vertical_bullet" when defining chart, somehow this:
new sap.viz.ui5.controls.vizframe({ ... viztype : "vertical_bullet", ... })
which should job. in case, want on fly, call
ovizframe.setviztype("vertical_bullet");
function.
best regards, dark
Comments
Post a Comment