echarts 多图下载

2022-06-28  本文已影响0人  卢卢2020

html2canvas

npm i html2canvas

<el-button  type="primary"   plain   size="mini"   @click="download" >Download</el-button>

import html2canvas from 'html2canvas'

methods: {   

download() {      // 图表转换成canvas      html2canvas(document.getElementById('download')).then(function (canvas) {        var img = canvas          .toDataURL('image/png')          .replace('image/png', 'image/octet-stream')        // 创建a标签,实现下载        var creatIMg = document.createElement('a')        creatIMg.download = '图表.png' // 设置下载的文件名,        creatIMg.href = img // 下载url        document.body.appendChild(creatIMg)        creatIMg.click()        creatIMg.remove() // 下载之后把创建的元素删除      })    },

}

上一篇 下一篇

猜你喜欢

热点阅读