您好,登錄后才能下訂單哦!
今天就跟大家聊聊有關(guān)wkhtmltopdf + echarts 問題的解決方法,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結(jié)了以下內(nèi)容,希望大家根據(jù)這篇文章可以有所收獲。
wkhtmltopdf github
wkhtmltopdf 使用手冊
開啟debug --debug-javascript 調(diào)試?yán)?/p>
不支持新的語法必如let 定義變量最好使用var
最好不要省略每條語句后面的分號`;`
table 跨頁導(dǎo)致表頭重疊的解決方法,給tr元素標(biāo)簽添加以下樣式
.tr { page-break-before: always; page-break-after: always; page-break-inside: avoid; }
pdf文件另起一頁,可以使用以下方式
<div ></div>
echarts 使用svg初始化餅狀圖,在瀏覽器預(yù)覽時正常,生成pdf后出現(xiàn)黑影。添加animation:false (為何使用svg而不是canvas,因?yàn)閟vg生成的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: "wuk0a0c%", align: 'left', }, legend: { type: 'scroll', x: 'right', y: 'top', orient: 'vertical', align: 'left', itemWidth: 10, itemHeight: 10, data: emailLegend }, calculable: true, animation: false, // 重點(diǎn)添加這行代碼即可解決 series: [{ name: '半徑模式', type: 'pie', center: ['40%', '50%'], radius: [38, 80], // roseType: 'radius', label: { normal: { formatter: "00o8e80%" }, }, lableLine: { normal: { show: false }, emphasis: { show: true } }, itemStyle: { normal: { shadowColor: 'rgba(0, 0, 0, 0.8)', shadowBlur: 5, } }, data: emailSeries }] }; emailSortChart.setOption(emailSortOption);
看完上述內(nèi)容,你們對wkhtmltopdf + echarts 問題的解決方法有進(jìn)一步的了解嗎?如果還想了解更多知識或者相關(guān)內(nèi)容,請關(guān)注億速云行業(yè)資訊頻道,感謝大家的支持。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。