pdf - 无法在柱形图上打印 jspdf
问题描述
祝大家有个美好的一天。我试图从我的柱形图(谷歌图表)中制作一个 pdf 文件,我正在使用 jspdf。当我尝试用条形图制作pdf文件时,饼图似乎代码工作正常
但是当我尝试在柱形图上对其进行编码时,它不会打印 pdf
我试图搜索我的代码,但看起来不错
google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Sales', 'Expenses', 'Profit'],
['2014', 1000, 400, 200],
['2015', 1170, 460, 250],
['2016', 660, 1120, 300],
['2017', 1030, 540, 350]
]);
var options = {
chart: {
title: 'Company Performance',
subtitle: 'Sales, Expenses, and Profit: 2014-2017',
}
};
var chart = new
google.charts.Bar(document.getElementById('columnchart_material'));
var btnSave = document.getElementById('save-pdf');
google.visualization.events.addListener(chart, 'ready', function () {
btnSave.disabled = false;
});
btnSave.addEventListener('click', function () {
var doc = new jsPDF();
doc.addImage(chcolumnchart_material.getImageURI(), 10, 10, 180, 150);
doc.save('chart.pdf');
}, false);
chart.draw(data, google.charts.Bar.convertOptions(options));
}
<script type="text/javascript"
src="https://www.gstatic.com/charts/loader.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.5/jspdf.min.js">
</script>
<input id="save-pdf" type="button" value="Save as PDF" disabled />
<div id="columnchart_material" style="width: 800px; height: 500px;"></div>
解决方案
物料getImageURI()
图表不支持图表方法。
材料--> google.charts.Bar
--packages: ['bar']
您需要使用经典图表。
经典--> google.visualization.BarChart
--packages: ['corechart']
或 -->google.visualization.ColumnChart
注意:有一个配置选项可以设置类似于材料图表的经典图表样式...
theme: 'material'
推荐阅读
- youtube-api - 已达到 YouTube 数据 API 限制!我怎样才能增加这个限制?
- c - cmocka.h:虽然安装了 cmocka,但没有这样的文件或目录——IBM watson 嵌入式 C 客户端库
- java - 为什么 bigDecimal 的 scale() 方法与 stripTrailingZeros() 方法结合时返回负值?
- json - 如何将 TimezoneDB 时间检索到 Swift 标签
- angular - Angular 7,仅在生产中获得“无法读取 null 的属性‘appendChild’”
- python - 使用 WIN64 的 Python 3.7.3 蓝牙上最新的 STRAIGHT SCOOP 是什么
- django - 如何防止内联字段引用 Django Admin 中最新创建的对象
- r - 如何将 CSV 文件上传到 R,其中一行包含 ["123"、"456"、"789"] 形式的列表?
- python - Pandas 中的分组和求和
- node.js - 将 Multer 验证错误传递给 React 组件