1

I am working on SAP HANA Development project where I need to develop an UI application using SAPUI5 and Odata service.

I need a help on getting the data from HANA table and display in the Pie or Bar Chart. I am getting the data to a table(oTable) using odata service but not able to display it in the Pie Chart.

Please find below the code snippet:

{
var oModel = sap.ui.model.odata.ODataModel('link of the .xsodata' false);
var oTable = new sap.ui.table.Table({tableId: "tableID", visibleRowCount: 10}); 
oTable.setTitle("Transactions"); 
oTable.setModel(oModel);
oTable.bindRows('/Transactions');

var dataset = new sap.service.visualization.dataset.SimpleDMDataset();
dataset.setDataTable(oTable);

var pie = new sap.service.visualization.chart.Pie("myPie", {
    width: "700px",
    height: "400px",
    allDeSelectable: true,
    legendFirst: true,
    selectionMode: 'single',
    legendDirection: 'right',
    title: 'Transactions',
    titleHorizontalAlign: 'center',
    subTitle: 'Q1 - 2012',
    subTitleHorizontalAlign: 'center',
    showTitle: true,
    defaultSelectedSliceIndexes: [5],
    legendFormatString: ['0.00%'],
    tooltipTextFormatString: ['0.00%'],
    tooltipMainValueFormatString: ['#,##0'],
    tooltipSubValueFormatString: ['0.00%'],
    showLegend: true,
    pieType: 'pie',
    dataset: dataset
});

pie.placeAt("uiAreaForMyControls");
}

Please help me in getting the Pie chart displayed with the data as I am new and in learning phase.

2 Answers 2

4

I noticed you were trying to use sap.service.visualization charts with datasets, different to previous answer, here are a couple of simple examples using Northwind OData services

JSBin: Viz Pie Chart example

JSBin: Viz Bar Chart example - more advanced uses a filter on dataset

enter image description here

1

The following is a very simple Pie Chart using the NorthWind OData service, same format as XSODATA

It shows the percentage of Products per Category an Expand is used to get the CategoryName - live demo
enter image description here

var sURI = 'http://services.odata.org/v3/Northwind/Northwind.svc/';
var oModel = new sap.ui.model.odata.ODataModel(sURI, true);


// Pie Chart
var oChart = new sap.makit.Chart({
    width : "100%",
    height: "80%",
    type : sap.makit.ChartType.Pie,
    legendPosition : sap.makit.LegendPosition.Top,
    valueAxis: new sap.makit.ValueAxis({}),
    categoryAxis: new sap.makit.CategoryAxis({}),
    category : new sap.makit.Category({
        column : "category",
    }),
    values : [new sap.makit.Value({
        expression : "products",
        format : "number",
    })],
});
oChart.addColumn(new sap.makit.Column({name:"category", value:"{Category/CategoryName}"}));
oChart.addColumn(new sap.makit.Column({name:"products", value:"{ProductID}", type:"number"}));
oChart.setModel(oModel);
oChart.bindRows({
     path: "/Products",
     parameters: {select: 'ProductID,Category/CategoryName',expand: 'Category'}
});
oChart.placeAt("content");

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.