VizFrame binding to ODATA model not working

[amber_garg]

Hi All,

I have a created a stacked combination chart using VizFrame class. For testing purpose , I took dummy data in JSON model in an array and it was working fine as expected.

Now I instead of JSON , I switched to ODATA model (from ECC) . This ODATA model is already been used in my app in other controls and is working fine. But the binding of OData model to the VizFrame chart does not seem to work as I get the error message

I checked in console debugging , the particular entityset which I am calling in my Odata is getting retrieved in the model with correct data as expected. So that means the problem most likely is in the binding between the Model and VizFrame Control.

Coding in View for chart.

var oChart = new sap.viz.ui5.controls.VizFrame("Chart",
                                        {
                                             uiConfig:{applicationSet:"fiori",
                                                   showErrorMessage : "true"
                                                      } ,
                                             height: "100%",
                                             width: "100%",
                                             vizType: "stacked_combination",

                                        }
                                               );
oChart.setVizProperties({
                      plotArea:{
                       dataShape:{
                        primaryAxis: ["line", "bar", "bar"]
                       }
                      }
                    });

Coding in Controller for binding

var oChart = sap.ui.getCore().byId("Chart");
  oChart.setModel(sap.ui.getCore().getModel("Model_Hdr"));

  var oDataset = new sap.viz.ui5.data.FlattenedDataset({
            dimensions: [{
                name: "Period",
                value: "{Period}"
            }],
            measures: [{
                name: 'Cost',
                value: '{Amount}'
            }, {
                name: 'PO Qty',
                value: '{TotItms}'
            }, {
                name: 'Delv Qty',
                value: '{DelItms}'
            }],
//            data: {
//                path: "/Vendor_ListSet('NEW 3')/VendToChart"
//            }
        }).bindData("Model_Hdr>/Vendor_ListSet('NEW 3')/VendToChart",null,null,[]);


  oChart.setDataset(oDataset);

        var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "valueAxis",
            'type': "Measure",
            'values': ["Amount", "TotItms", "DelItms"]
        }),
        feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "categoryAxis",
            'type': "Dimension",
            'values': ["Period"]
        });

  oChart.addFeed(feedValueAxis);
  oChart.addFeed(feedCategoryAxis);

[saivellanki · Accepted solution]

Hi Amber,

I guess you declared a name for your model Model_Hdr. If so, then your code should be (Model name applies to your property binding as well):

  var oDataset = new sap.viz.ui5.data.FlattenedDataset({  
            dimensions: [{  
                name: "Period",  
                value: "{Model_Hdr>Period}"  
            }],  
            measures: [{  
                name: 'Cost',  
                value: '{Model_Hdr>Amount}'  
            }, {  
                name: 'PO Qty',  
                value: '{Model_Hdr>TotItms}'  
            }, {  
                name: 'Delv Qty',  
                value: '{Model_Hdr>DelItms}'  
            }],  
//            data: {  
//                path: "/Vendor_ListSet('NEW 3')/VendToChart"  
//            }  
        }).bindData("Model_Hdr>/Vendor_ListSet('NEW 3')/VendToChart",null,null,[]);  
  oChart.setDataset(oDataset);  

Regards,

Sai Vellanki.

[amber_garg · Accepted solution]

Hi Sai,

Yes I had tried with that also earlier but it shows same error. Please find the updated code below.

var oChart = sap.ui.getCore().byId("Chart");
  oChart.setModel(sap.ui.getCore().getModel("Model_Hdr"));

  var oDataset = new sap.viz.ui5.data.FlattenedDataset({
            dimensions: [{
                name: "Period",
                value: "{Model_Hdr>Period}"
            }],
            measures: [{
                name: 'Cost',
                value: '{Model_Hdr>Amount}'
            }, {
                name: 'PO Qty',
                value: '{Model_Hdr>TotItms}'
            }, {
                name: 'Delv Qty',
                value: '{Model_Hdr>DelItms}'
            }],
//            data: {
//                path: "/Vendor_ListSet('NEW 3')/VendToChart"
//            }
        }).bindData("Model_Hdr>/Vendor_ListSet('NEW 3')/VendToChart",null,null,[]);


  oChart.setDataset(oDataset);

        var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "valueAxis",
            'type': "Measure",
            'values': ["Amount", "TotItms", "DelItms"]
        }),
        feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "categoryAxis",
            'type': "Dimension",
            'values': ["Period"]
        });

  oChart.addFeed(feedValueAxis);
  oChart.addFeed(feedCategoryAxis);

[Former Member · Accepted solution]

In your dataset, the name attribute has to be same as in the values array of the feeds.

Period, Cost, PO Qty, DelvQty are not equal to Amount, TotItms, DelItms, Period

Change it to

1.   var oDataset = new sap.viz.ui5.data.FlattenedDataset({ 
2.             dimensions: [{ 
3.                 name: "Period", 
4.                 value: "{Model_Hdr>Period}" 
5.             }], 
6.             measures: [{ 
7.                 name: 'Amount', 
8.                 value: '{Model_Hdr>Amount}' 
9.             }, { 
10.                 name: 'TotItms', 
11.                 value: '{Model_Hdr>TotItms}' 
12.             }, { 
13.                 name: 'DelItms', 
14.                 value: '{Model_Hdr>DelItms}' 
15.             }], 

I think that should do the trick.