file图片文件绘制到可自定义宽高的canvas中

              const canvas = document.getElementById('canvasImg')
              const context = canvas.getContext('2d')
              context.clearRect(0, 0, canvas.width, canvas.height)
              let imgSrc = window.URL.createObjectURL(file)// 获取file文件路径

              const img = new Image()
              img.width = that.graphOptionsWidth
              img.height = that.graphOptionsHeight
              img.src = imgSrc
              img.onload = () => {
                context.drawImage(img, 0, 0, that.graphOptionsWidth, 
                that.graphOptionsHeight)// 这里用image对象，不能用base64路径

                function dataURLtoFile (dataURI, type) {
                  let binary = atob(dataURI.split(',')[1])

                  let array = []
                  for (let i = 0; i < binary.length; i++) {
                    array.push(binary.charCodeAt(i))
                  }
                  return new Blob([new Uint8Array(array)], { type: type })
                }
                file = dataURLtoFile(canvas.toDataURL('image/png'), 'image/png')// 先转base64 再生成blob类文件对象

                param.append('file', file)
                console.log(file)
                let config = {
                  headers: { 'Content-Type': 'multipart/form-data' }
                }
                that.editorAxios.post(host, param, config).then(res => {
                  console.log(res.data, 'resdata')
                  //   let url = 'https://static.runjian.com/' + dir + filename + extName
                  let url = host + '/' + dir + filename + extName
                  console.log(url, 'url')

                  //   设置背景图
                  that.graph.drawBackground({
                    color: '#f5f5f5',
                    image: url,
                    //   position: { x: 0, y: 0 },
                    size: { width: that.graphOptionsWidth, height: that.graphOptionsHeight }
                  })
              })