将Google Chart导出到Excel表格中

Im使用ng-google-chart从我从数据库接收到的数据创build图表。 我将数据存储在一个表中。 我需要导出表和图表。

我正在使用以下技术导出表（其中“可导出”是包含表的div）：

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

我找不到任何方法将图表添加到此文件。

这是生成图表的代码

 var chart1 = {}; chart1.type = "ColumnChart"; chart1.cssStyle = "height:400px; width:500px;"; chart1.data = { "cols": [ { id: "gender", label: "Gender", type: "string" }, { id: "number", label: "number", type: "number" } ], "rows": [ { c: [ { v: "male" }, { v: $scope.male, f: $scope.male } ] }, { c: [ { v: "female" }, { v: $scope.female } ] } ] }; chart1.options = { "title": "", "isStacked": "true", "fill": 20, "displayExactValues": true, "vAxis": { "title": "Number", "gridlines": { "count": 6 } }, "hAxis": { "title": "gender" } }; chart1.formatters = {}; $scope.chart = chart1; } 

Answer 1

为了getImageURI的图表，等待ready事件并调用函数。
然后你可以在页面的某个地方添加图片。
你甚至可以隐藏原来的图表，如果需要的话…
以下是将图像URI加载到另一个元素的示例。

 google.load('visualization', '1', {packages:['corechart'], callback: drawChart}); function drawChart() { var data = google.visualization.arrayToDataTable([ ["Element", "Density", { role: "style" } ], ["Copper", 8.94, "#b87333"], ["Silver", 10.49, "silver"], ["Gold", 19.30, "gold"], ["Platinum", 21.45, "color: #e5e4e2"] ]); var view = new google.visualization.DataView(data); view.setColumns([0, 1, { calc: "stringify", sourceColumn: 1, type: "string", role: "annotation" }, 2]); var options = { title: "Density of Precious Metals, in g/cm^3", width: 600, height: 400, bar: {groupWidth: "95%"}, legend: { position: "none" }, }; var chart = new google.visualization.ColumnChart(document.getElementById("chart_div")); google.visualization.events.addListener(chart, 'ready', function () { document.getElementById("chart_image").insertAdjacentHTML('beforeEnd', '<img alt="Chart Image" src="' + chart.getImageURI() + '">'); }); chart.draw(view, options); } 

 <script src="https://www.google.com/jsapi"></script> <span>CHART</span> <div id="chart_div"></div> <br/> <span>IMAGE</span> <div id="chart_image"></div>