cancel
Showing results for 
Search instead for 
Did you mean: 

Charting Code

Former Member
0 Kudos

Hi All

Please can anyone check this code and advise as to why I do not see anything when I run the application.

<!DOCTYPE html>

<html>

<head>

   <meta http-equiv="X-UA-Compatible" content="IE=edge" />

   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

   <title>Test Chart</title>

   <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
   type="text/javascript"
   id="sap-ui-bootstrap"
   data-sap-ui-libs="sap.ui.core,sap.ui.commons,sap.viz,sap.ui.demokit"
   data-sap-ui-theme="sap_goldreflection">

   </script>

   <script>

   // some business data
   var oModel = new sap.ui.model.json.JSONModel({

   businessData : [

  {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}

  ]

  });

   // A Dataset defines how the model data is mapped to the chart
   var oDataset = new sap.viz.ui5.data.FlattenedDataset({

   // a Bar Chart requires exactly one dimension (x-axis)
   dimensions : [

  {

   axis : 1, // must be one for the x-axis, 2 for y-axis
   name : 'Country',

   value : "{Country}"
   }

  ],

   // it can show multiple measures, each results in a new set of bars in a new color
   measures : [

   // measure 1
   {

   name : 'Profit', // 'name' is used as label in the Legend
   value : '{profit}' // 'value' defines the binding for the displayed value
   },

  {

   name : 'Revenue',

   value : '{revenue}'
   }

  ],

   // 'data' is used to bind the whole data collection that is to be displayed in the chart
   data : {

   path : "/businessData"
   }

  });

   // create a Bar chart
  // you also might use Combination, Line, StackedColumn100, StackedColumn or Column
  // for Donut and Pie please remove one of the two measures in the above Dataset.
   var oBarChart = new sap.viz.ui5.Bar({

   width : "80%",

   height : "400px",

   plotArea : {

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

   title : {

   visible : true,

   text : 'Profit and Revenue By Country'
   },

   dataset : oDataset
   });

   // attach the model to the chart and display it
   oBarChart.setModel(oModel);

   oBarChart.placeAt("content");

   </script>

</head>

<body class="sapUiBody">

<div id="content"></div>

</body>

</html> 

Accepted Solutions (1)

Accepted Solutions (1)

saivellanki
Active Contributor
0 Kudos

Hi Asif,


OpenUI5 doesn't have sap.viz library. Instead point your source to sapui5, then your code will work - https://sapui5.hana.ondemand.com/resources/sap-ui-core.js


Regards,

Sai Vellanki.

Former Member
0 Kudos

No  still Not working

saivellanki
Active Contributor
0 Kudos

Asif,

I have just copy-pasted your code pointing the src to https://sapui5.hana.ondemand.com/resources/sap-ui-core.js and it works for me. Check the sample here: Plunker

Regards,

Sai Vellanki.

Former Member
0 Kudos

Good, Working now.

Thanks.

former_member182862
Active Contributor
0 Kudos

Hi Asif

Can you be so kind to mark Sai's answer as Correct if it is working?

Thanks

Dennis (Moderator)

Former Member
0 Kudos

done.

Answers (0)