SAPUI5将图表导出为xlsx文件

时间:2018-07-31 12:15:38

标签: javascript excel sapui5 export-to-excel

我有一个简单的图表和一个按钮。为了创建所需的图表,我使用了sap.viz.ui5.controls.VizFrame组件。

带有按钮的想法是,当用户单击按钮时,必须将图表导出为 xlsx 文件。 我看到可以将sapui5图表导出为图像,但是我的客户要求将其导出为 xlsx 文件。

因此,我正在客户端上寻找外部库或任何其他想法或解决方案,可用于将该图表导出为 xlsx 文件。

查看:

sap.ui.jsview("app.views.chart", {
  getControllerName: function() {
    return "app.controllers.chart";
  },
  createContent: function(oController) {
    var oModel = new sap.ui.model.json.JSONModel("app/model/chart.data.json");
    oController.getView().setModel(oModel);
    return new sap.m.App({
      pages: [
        new sap.m.Page({
          title: "My fourth page",
          content: [
            new sap.m.Switch({
              name: "Switch label",
              state: true,
              change: oController.onChange
            }),
            new sap.viz.ui5.controls.VizFrame("cars-chart-id", {
              width: "100%",
              height: "100%",
              uiConfig: {
                applicationSet: "fiori"
              },
              vizType: "bar",
              vizProperties: {
                plotArea: {
                  colorPalette: d3.scale.category20().range(),
                  dataLabel: {
                    visible: true
                  }
                }
              },
              dataset: new sap.viz.ui5.data.FlattenedDataset({
                dimensions: [{
                  axis: 1,
                  name: "Model",
                  value: "{Model}"
                }],
                measures: [{
                  name: "Nr Cars",
                  value: "{Value}"
                }]
              }).bindData("/", null, null, []),
              feeds: [
                new sap.viz.ui5.controls.common.feeds.FeedItem({
                  'uid': "categoryAxis",
                  'type': "Dimension",
                  'values': ["Model"]
                }),
                new sap.viz.ui5.controls.common.feeds.FeedItem({
                  'uid': "valueAxis",
                  'type': "Measure",
                  'values': ["Nr Cars"]
                })
              ]
            })
          ]
        })
      ]
    });
  }
});

0 个答案:

没有答案