无法下载最终合并的画布

问题描述

我在1上合并2个画布。

I am merging 2 canvas on 1.

一切正常。

这第三个画布上点击。我使用下面的代码合并2画布和下载最终的画布：

I just want to download this 3rd canvas on a click. I am using below code for merging 2 canvas and than download the final canvas:

function downloadCanvas() {
  var bottleCanvas = document.getElementById('canvas_thumb');
  var designCanvas = document.getElementById('canvas');
  var finCanvas = document.getElementById('finalcanvas');

  var bottleContext = finCanvas.getContext('2d');
  bottleContext.drawImage(bottleCanvas, 0, 0);
  bottleContext.drawImage(designCanvas, 0, 320);


  var link = document.createElement('a');
  link.href = finCanvas.toDataURL("image/png").replace("image/png", "image/octet-stream");  
  link.download = "imagename.png";

  link.click();
}

但没有运气。我不能下载输出画布。

But no luck. I am not able to download the output canvas.

我无法在此代码中找到任何错误。

I am not able to find any error in this code.

请帮助。

感谢

推荐答案

 var dataURL = finCanvas.toDataURL("image/png");
  var link = document.createElement('a');

  link.href = finCanvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
  link.download = "design.png";
  link.click();

这篇关于无法下载最终合并的画布的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！