Question

我正在使用nvd3.js来创建饼图。我想将此图表导出到Excel。出口我正在使用FileSaver.js

我的HTML看起来像：

<body ng-controller="MainCtrl">
<button ng-click="exportData()">click</button>
<div id="charts">
   <nvd3  options="options" data="data"></nvd3>
</div>    
</body>

我的代码如下：

var app = angular.module('plunker', ['nvd3']);

app.controller('MainCtrl', function($scope) {

$scope.exportData = function () {
    alert("function call");
    var blob = new Blob([document.getElementById('charts').innerHTML ], {
        type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
    });
    saveAs(blob, "Report.xls");
};

$scope.options = {
        chart: {
            type: 'pieChart',
            height: 500,
            x: function(d){return d.key;},
            y: function(d){return d.y;},
            showLabels: true,
            transitionDuration: 500,
            labelThreshold: 0.01,
            legend: {
                margin: {
                    top: 10,
                    right: 35,
                    bottom: 5,
                    left: 0
                }
            },   
        }
    };

    $scope.data = [
        {
            key: "suraj",
            y: 5
        },
        {
            key: "darshan",
            y: 2
        },
        {
            key: "kapil",
            y: 9
        },
        {
            key: "Four",
            y: 7
        },
        {
            key: "Five",
            y: 4
        },
        {
            key: "Six",
            y: 3
        },
        {
            key: "Seven",
            y: .5
        }
    ];
});

感谢您的帮助！

nvd3.js饼图以角度js导出到Excel

0 个答案: