首页 > 其他 > 详细

前端实现导出Echarts图表

时间:2020-04-17 19:08:14      阅读:374      评论:0      收藏:0      [点我收藏+]

  导出Echart图表,很简单,我这里用的是vue。

  下面的事件函数是你自己创建按钮点击或者其他操作来触发的。(Echarts内部也自带下载图片的功能。网上一搜一堆都能找到)

  handleClickExportEcharts(){//导出Echart
                const canvas = document.getElementsByTagName(‘canvas‘)[0];
                let image = canvas.toDataURL({
                    type:"png",
                    pixelRatio: 2,
                    // backgroundColor:‘#f1f6f9‘,//有人说不设置此项,导出图片的底色是黑色。我个人设置了也并没有什么卵用 要想设置导出图片有底色,就要设置Echart的背景色,不设置就是透明的。
                });
                let alink = document.createElement("a");
                    alink.href = image;
                    alink.download = "Echarts图"; //导出的图片名
                    alink.click();
        },

前端实现导出Echarts图表

原文:https://www.cnblogs.com/bai--feng/p/12721617.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!