ECharts怎么打印数据

类型:软件教程 来源:网络收集

echarts是一个第三方的图图表控件,可以按照你的数据制作出很多不同类型的图表,更直观的感受到数据变化,有些用户需要把图标打印下来,那么该怎么设置打印呢,接下来一起来看看吧。

ECharts怎么打印数据

一、 首先我们要做的,就是在Echarts图标上方定义一个img

1 2 ECharts怎么打印数据3

二、然后第二步,我们要创建一个用来打印的按钮。

1

ECharts怎么打印数据

三、接下来,我们只需要定义打印函数就可以了,现在就把相关函数代码放在下面,可以自取哦。

1functionPrintImage(){2//把echarts图片转成64编码的图片3varimg=newImage();4varimgSrc=myChart.getDataURL();5//渲染到图表上面展示6$("#printImg").attr("src",imgSrc).show();7//这里要使用延时加载,才不会在图片还没渲染出来的时候就调用打印的方法8setTimeout(function(){9//直接调用浏览器打印功能10bdhtml=window.document.body.innerHTML;11//定义打印区域起始字符,根据这个截取网页局部内容12sprnstr="";//打印区域开始的标记13eprnstr="";//打印区域结束的标记14prnhtml=bdhtml.substr(bdhtml.indexOf(sprnstr)+17);15prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));16//还原网页内容17window.document.body.innerHTML=prnhtml;18//开始打印19window.print();20},1000);2122}