导出PDF（四）Echarts统计图导出PDF文件

        根据网上所查资料显示，目前不支持直接将Echarts统计图导出为PDF文件，但是可以将统计图转成图片，再将图片转成PDF文件。此处使用了插件html2canvas.min.js及jspdf.min.js：

document.write("<script type='text/javascript' src='./topdf/html2canvas.min.js'></script>");
document.write("<script type='text/javascript' src='./topdf/jspdf.min.js'></script>");
document.write("<script type='text/javascript' src='./topdf/echarts.min.js'></script>");

var myChart = echarts.init(document.getElementById('main'));

var option = {
    backgroundColor: 'white',
    title: {
        text: 'ECharts 入门示例'
    },
    tooltip: {},
    legend: {
        data: ['销量']
    },
    xAxis: {
        data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'line',
        data: [5, 20, 36, 10, 10, 20]
    }]
};

myChart.setOption(option);

function convertCanvasToImage() {
	
	html2canvas(document.getElementById('main'), {
	        onrendered: function(canvas) {
	           /* document.body.appendChild(canvas); */
	            createPDFObject(canvas.toDataURL("image/jpeg"));
	        }
	});
}

function createPDFObject(imgData) {
    //默认a4纸张
    var doc = new jsPDF('p', 'pt',"a3");
    doc.addImage(imgData, 5, 5, 600, 300, 'img');
    doc.save('GCXDATA_PDF.pdf');
}

<div id="main" style="height:400px"></div> 
<button onclick="convertCanvasToImage()">download pdf</button>

参考：https://segmentfault.com/a/1190000011478657

          https://segmentfault.com/q/1010000013080174