Question

如何将屏幕截图中显示的图例标题更改为所有垂直条的计数。防爆;总计：11

为什么默认的启动y轴值从500米开始？我该如何更改？

下面的示例Screenshot

控制器代码：

    onInit: function() {

//      1.Get the id of the VizFrame
        var oVizFrame = this.getView().byId("idcolumn");

//      2.Create a JSON Model and set the data
        var oModel = new sap.ui.model.json.JSONModel();
        var data = {
        'Coaches' : [
        {"Name": "Singapore","Value": "1"},
        {"Name": "India","Value": "1"},
        {"Name": "Germany","Value": "2"},
        {"Name": "South Africa","Value": "1"},
        {"Name": "Turkey","Value": "0"},
        {"Name": "Japan","Value": "1"},
        {"Name": "China","Value": "2"},
        {"Name": "France","Value": "2"},
        {"Name": "ArgentinasdfsdfddfsdfsdAA","Value": "1"},
        ]};

        oModel.setData(data);

        this.getView().setModel(oModel);

//      3. Create Viz dataset to feed to the data to the graph
        var oDataset = new sap.viz.ui5.data.FlattenedDataset({
        dimensions : [{ name : 'Country',value : "{Name}" }],
        measures :   [{ name : 'Total No of KFC Branches', value : '{Value}' }],
        data : { path : "/Coaches" }
        });

// Binding Model and Dataset to the Frame
        oVizFrame.setDataset(oDataset);
        oVizFrame.setModel(oModel);
        oVizFrame.setVizType('column'); // column or bar

//      4.Set Viz properties
// Ref Link: https://sapui5.netweaver.ondemand.com/docs/vizdocs/index.html#reference/chartProperty/Charts/Bar%20%20(13)/Column%20Chart/
        oVizFrame.setVizProperties({
            title:    { text : "KFC Statistics" },
            general:  { background : { border : { top : { visible : true } } } },
            general:  { background : { border : { bottom : { visible : true } } } },
            general:  { background : { border : { right : { visible : true } } } },
            general:  { background : { border : { left : { visible : true } } } },
            // valueAxis: { title : { text : "Totallll" }},
            legend:   { isScrollable : true },
            legend:   { visible : true },
            legend:   { title : { visible : true } }, 
            legend:   { title : { text : "All Measures"  } },
            plotArea: { dataLabel : { visible : true} }
        });

// Axis Specification
        var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
            'uid': "valueAxis",
            'type': "Measure",
            'values': ["Total No of KFC Branches"]
            }),

            feedCategoryAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
                'uid': "categoryAxis",
                'type': "Dimension",
                'values': ["Country"]
                });`enter code here`

// Addition of Axis to Frame
        oVizFrame.addFeed(feedValueAxis);
        oVizFrame.addFeed(feedCategoryAxis);        

    }

Answer 1

您使用的是哪个版本的SAPUI5？我使用的是1.44.5，你的例子很好看（见截图）

您可以通过添加

来更改y轴上的值

yAxis: { scale: { fixedRange: true, minValue: 0, maxValue: 3 }}

到oVizFrame.setVizProperties。

你的另一个问题更复杂，因为没有简单的方法来获得“价值总和”。

您必须在显示之前计算总数

    //      3. Create Viz dataset to feed to the data to the graph
    var coaches = oModel.getProperty("/Coaches");
    var ttl = 0;
    for (var i = 0; i < coaches.length; i++) {
        ttl +=  parseInt(coaches[i].Value);
    }
    var total = "Total " + ttl;

    var oDataset = new FlattenedDataset({
        dimensions: [{
            name: 'Country',
            value: "{Name}"
        }],
        measures: [{
            name: total,
            value: '{Value}'
        }],
        data: {
            path: "/Coaches"
        }
    });

和

// Axis Specification
var feedValueAxis = new sap.viz.ui5.controls.common.feeds.FeedItem({
    'uid': "valueAxis",
    'type': "Measure",
    'values': [total]
}),

如何在SAPUI5 VizFrame中为柱形图

1 个答案: