【echarts转base64】Vue 将echarts转为base64图片展示

获取页面上全部的echarts

const chartArr = document.querySelectorAll('.chart-pic')

遍历数组 将第一个画布作为基准（echarts）

for (let i = 0; i < chartArr.length; i++) {
  // chartArr[i]为当前echarts的dom
  // 将第一个画布作为基准
  var baseCanvas = chartArr[i].getElementsByTagName('canvas')[0]
  if (!baseCanvas) { return false }
  // 删除原本echarts图表盒子
  chartArr[i].remove()
  // 获取base64位的url 放入数组中
  this.chartUrlArr.push(baseCanvas.toDataURL())
}

chartUrlArr中存储的是echarts转base64之后得结果

将结果放到img标签的src中

<div name="chart">
  <line-bar-chart class="chart-pic" :chart-data="dailyActiveAddressNumChartData" :type="'line'" />
  <img :src="chartUrlArr[2]" class="chart-to-pic">
</div>