wkhtmltopdf+echarts问题的解决方法
今天就跟大家聊聊有关wkhtmltopdf + echarts 问题的解决方法,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
成都创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于成都网站设计、网站建设、杨浦网络推广、微信平台小程序开发、杨浦网络营销、杨浦企业策划、杨浦品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;成都创新互联公司为所有大学生创业者提供杨浦建站搭建服务,24小时服务热线:18980820575,官方网址:www.cdcxhl.com
wkhtmltopdf github
wkhtmltopdf 使用手册
开启debug --debug-javascript 调试利器
不支持新的语法必如let 定义变量最好使用var
最好不要省略每条语句后面的分号`;`
table 跨页导致表头重叠的解决方法,给tr元素标签添加以下样式
.tr { page-break-before: always; page-break-after: always; page-break-inside: avoid; }
pdf文件另起一页,可以使用以下方式
echarts 使用svg初始化饼状图,在浏览器预览时正常,生成pdf后出现黑影。添加animation:false (为何使用svg而不是canvas,因为svg生成的pdf清晰度更高)
var emailSortChart = echarts.init(document.getElementById('emailSort'), null, {renderer: 'svg'}); var emailSortData = jsonData; var emailLegend = [], emailSeries = []; emailSortData.forEach(function (item) { var name = item['email_from'].length <= 20 ? item['email_from'] : item['name'].slice(0, 20) + '...'; emailLegend.push(name); emailSeries.push({ value: item['count_num'], name: name, }); }); var emailSortOption = { color: ["#833bf4", "#fd8a6d", "#20b6db", "#0b92fe", "#d071e5"], tooltip: { trigger: 'item', formatter: "{d}%", align: 'left', }, legend: { type: 'scroll', x: 'right', y: 'top', orient: 'vertical', align: 'left', itemWidth: 10, itemHeight: 10, data: emailLegend }, calculable: true, animation: false, // 重点添加这行代码即可解决 series: [{ name: '半径模式', type: 'pie', center: ['40%', '50%'], radius: [38, 80], // roseType: 'radius', label: { normal: { formatter: "{d}%" }, }, lableLine: { normal: { show: false }, emphasis: { show: true } }, itemStyle: { normal: { shadowColor: 'rgba(0, 0, 0, 0.8)', shadowBlur: 5, } }, data: emailSeries }] }; emailSortChart.setOption(emailSortOption);
看完上述内容,你们对wkhtmltopdf + echarts 问题的解决方法有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注创新互联行业资讯频道,感谢大家的支持。
网页标题:wkhtmltopdf+echarts问题的解决方法
URL链接:http://scyanting.com/article/pishjo.html