echarts层级太高 使用canvasToTempFilePath转图片

小程序中echarts因为小程序原生的canvas层级太高，而导致弹窗这类dom元素无法遮挡住canvas

用hidden实现显隐 这样会使得echart隐藏的时候留下一片空白 效果还是不好

文档上有个canvasToTempFilePath接口 可以将canvas转为图片 可以在canvas隐藏的时候替换掉

但是新版 Canvas 2D 已经改成 RenderingContext  而RenderingContext又没有draw()方法

可以在节点对象exec方法回调 实现canvasToTempFilePath的功能 具体方法如下：

convertCanvasToImg(){
    const comp = this.selectComponent("#echart-radar") // 父组件获取子组件实例对象
    const query = wx.createSelectorQuery().in(comp) // 自定义组件实例
    query.select('.ec-canvas').fields({ node: true, size: true })
    .exec(res=>{
      const {width,height} = res[0]
      const canvas = res[0].node
        wx.canvasToTempFilePath({
          x: 0,
          y: 0,
          width,
          height,
          destWidth:width * pixelRatio,
          destHeight: height * pixelRatio,
          fileType: 'jpg',
          quality:1,
          canvasId: 'echart-radar',
          canvas, // canvas type="2d" 时实例不能忘记 不然会报canvas is empty的错误
          success: (res) => {
            console.log(res)
          },
          fail(error) {
            console.log(error);
          },
          complete(res){
            console.log(res)
          }
      });
    })
  }