Quantcast
Channel: SCN : Popular Discussions - SAP Enterprise Portal: Content Management and Collaboration
Viewing all articles
Browse latest Browse all 1826

Display sap ui 5 chart [ bar chart] using data from the webservice .

$
0
0

HI All,
     i am using report engine webserive to get the data from the server but is there any way to display these data in a bar chart i have found a sample code to represent the static data in the control option but i did;nt find any code how fill the chart dynamicaly ,

if any one has  any idea of this same please share with me.
Here i attached the code and am able to access only the ID but i can't access the data which is inside the JSON object with in another JSON Object please help me .

<script>
  var str;
  function buttonClicked(oControlEvent)
    {
        alert('it Worked');
        var url = "test.jsp";
        alert('After url')
    req = new XMLHttpRequest();
    if (req){
        req.onreadystatechange = processReqChange;
        req.open("GET", url, true);
        req.send(null);
         }
    else{
        alert("Failed to Create XML Request Object.");
    }
    function processReqChange(){
    if (req.readyState == 4){
        if (req.status == 200){
            var response;
            document.getElementById("myxml").innerHTML = req.responseText;
            str = req.responseText
            alert(str);
            alert("here it comes");
   oLayout.createRow(oButton2);
            oLayout.placeAt("uiArea1");
        }
    }
}
    };
  function showChart(oControlEvent)
    {
   var spl = str.split("rctx");
   alert(spl.length);
   var splData = spl[1].split(");</script");
   var data = '{"rctx'+splData[0];
   alert(data);
   var obj = eval ("(" + data + ")");
   alert(obj.rctx[0].datapath[1].n);
   //The function for the graph starts here
  
  
   var oModel = new sap.ui.model.json.JSONModel({
    businessData : obj.rctx
   }); 
   var oDataset = new sap.viz.ui5.data.FlattenedDataset({

    dimensions : [
     {
      axis : 1,
      name : 'Id',
      value : "{datapath[{'id'}.v]}"
     }
    ],

    measures : [
     {
      name : 'Sales Revenue',
      value : '{id}'
     },
     /* {
      name : 'Rank',
      value : '{rank}'
     },  */
//      {
//       name : 'Fouls',
//       value : '{fouls}'
//      }
    ],
   
    data : {
     path : "/businessData"
    }
   
   });

   var oBarChart = new sap.viz.ui5.Bar({
    width : "80%",
    height : "400px",
    plotArea : {
    },
    title : {
     visible : true,
     text : 'Detailed Report'
    },
   

    dataset : oDataset
   });

   oBarChart.setModel(oModel);
   oBarChart.placeAt("uiArea");
       
    };
  </script>


Thanks & Regards

SUJIL T


Viewing all articles
Browse latest Browse all 1826

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>