Data binding using javascript ?

[abesh]

I was trying to reproduce a similar result if I substitute the Javascript Object Literal notation with Javascript methods and objects for a Pie chart. So I have this :

var dataset1 = new sap.viz.ui5.data.FlattenedDataset({

                                                  dimensions : [ {

                                                            axis : 1,

                                                            name : 'Product',

                                                            value : "{Material}"

                                                  } ],

                                                  measures : [ {

                                                            name : 'Quantity',

                                                            value : '{PercQuantity}'

                                                  } ],

                                                  data : {

                                                            path : "/Rowset/Row",

                                                            factory : function() {

                                                            }

                                                  }

                                        });

And the corresponding code I wrote replacing the one above is :

dataset1 = new sap.viz.ui5.data.FlattenedDataset();

var dimObject = new sap.viz.ui5.data.DimensionDefinition();

dimObject.setAxis(1);

dimObject.setName("Product");

dimObject.setValue("{Material}");

dataset1.addDimension(dimObject);

var measObject = new sap.viz.ui5.data.MeasureDefinition();

measObject.setName("Quantity");

measObject.setValue("{PercQuantity}");

dataset1.addMeasure(measObject);

dataset1.bindData("/Rowset/Row", "");

Which seems to not work . Esp. it seems that UI5 fails to interpret this line for the data binding :

dimObject.setValue("{Material}"); & measObject.setValue("{PercQuantity}");

What exactly am I doing wrong ? What is the alternative if I want to do it not the JS Obj Literal notation way ?

Thanks so much

[GrahamRobbo · Accepted solution]

Hi Abesh,

think I have cracked this. You need to bind the property as follows.

dataset1 = new sap.viz.ui5.data.FlattenedDataset();

var dimObject = new sap.viz.ui5.data.DimensionDefinition();

dimObject.setAxis(1);

dimObject.setName("Product");

dimObject.bindProperty("value","Material");  /* Use this instead of setValue method */

dataset1.addDimension(dimObject);

var measObject = new sap.viz.ui5.data.MeasureDefinition();

measObject.setName("Quantity");

measObject.bindProperty("value","PercQuantity"); /* Use this instead of setValue method */

dataset1.addMeasure(measObject);

dataset1.bindData("/Rowset/Row", "");

Cheers

Graham Robbo

[Former Member]

hi,Abesh, You are experienced in using pie chart, I'm new,will please give me some help？my codes as the following:

var oBusinessData = [ {

                              Country : "Canada",

                              revenue : 410.87,

                              profit : -141.25,

                              population : 34789000

                    }, {

                              Country : "China",

                              revenue : 338.29,

                              profit : 133.82,

                              population : 1339724852

                    }, {

                              Country : "France",

                              revenue : 487.66,

                              profit : 348.76,

                              population : 65350000

                    }, {

                              Country : "Germany",

                              revenue : 470.23,

                              profit : 217.29,

                              population : 81799600

                    }, {

                              Country : "India",

                              revenue : 170.93,

                              profit : 117.00,

                              population : 1210193422

                    }, {

                              Country : "United States",

                              revenue : 905.08,

                              profit : 609.16,

                              population : 313490000

                    } ];

                    oModel = new sap.ui.model.json.JSONModel();

                    oModel.setData({

                              businessData : oBusinessData

                    });

                    var dataset = new sap.viz.ui5.data.FlattenedDataset({

                              dimensions : [ {

                                        axis : 1,

                                        name : 'Country',

                                        value : "{Country}"

                              } ],

                              measures : [ {

                                        name : 'Profit',

                                        value : '{profit}'

                              } ],

                              data : {

                                        path : "/businessData",

                                        factory : function (){

                                        }

                              }

                    });

                    var donut = new sap.viz.ui5.Donut({

                              width : "800px",

                              height : "400px",

                              plotArea : {

                              // 'colorPalette' : d3.scale.category20().range()

                              },

                              title : {

                                        visible : true,

                                        text : 'Profit By Country'

                              },

                              dataset : dataset

                    });

But there is an error,how can I solve it? Thank you!

Uncaught TypeError: Object function () { this.aBuffer = []; this.aRenderedControls = []; this.aStyleStack = [ {} ]; } has no method 'forceRepaint'

[abesh]

Lucy, it would be difficult to debug without seeing the entire design / code / data

[Former Member]

Hi,Abesh,

After I update my sapui5 to 2013.1.11 version, all the workItem in the shell(sap.ui.ux3.Shell) not response to the click, as if the event can not be listened,  oShell.attachWorksetItemSelected(selectWorkItem); my function selectWorkItem is not reached,While the shell is ok in other project, what do you think caused this problem? Thank you

[Qualiture]

Hi Abesh,

If I recall correctly, I once had a similar problem -- it wasn't related to SAPUI5 but JSON /jQuery in general)

I'm doing this on top of my head so I might be terribly wrong, but what I think I did was assign the literal notation to a variable, and use that variable in the setter method.

Not sure why it worked though, might have something to do with the notation

[abesh]

Robin,

I am sure that would definitely work I am just trying to find out if there's a way to achieve this without any form of literal notation

[Qualiture]

I see... but is the {Material} part in dimObject.setValue("{Material}"); not a form of literal notation anyway?

[abesh]

hmmm... that's true... let me try that and report back Thanks so much

[abesh]

OK tried this :

var dimObject = new sap.viz.ui5.data.DimensionDefinition();

dimObject.setAxis(1);

dimObject.setName("Product");

var dimVal = "{Material}";

dimObject.setValue(dimVal);

dataset1.addDimension(dimObject);

var measObject = new sap.viz.ui5.data.MeasureDefinition();

measObject.setName("Quantity");

var measVal = "{PercQuantity}";

measObject.setValue(measVal);

dataset1.addMeasure(measObject);

as well as this :

var dimObject = new sap.viz.ui5.data.DimensionDefinition();

dimObject.setAxis(1);

dimObject.setName("Product");

var mat = "Material";

var dimVal = "{" + mat + "}";

dimObject.setValue(dimVal);

dataset1.addDimension(dimObject);

var measObject = new sap.viz.ui5.data.MeasureDefinition();

measObject.setName("Quantity");

var qty = "PercQuantity";

var measVal = "{" + qty + "}";

measObject.setValue(measVal);

dataset1.addMeasure(measObject);

Both did not work