Javascript 画布乘数未按预期工作

我正在尝试向以下代码添加一个乘法器，以在使用此工具保存画布两侧时生成更高质量的图像，但我使用fabricjs 1.7.22时运气不佳：

 // Save Canvases as Images
  $("#save").click(save);

  function download(url, name) {
    $("<a>")
      .attr({
        href: url,
        download: name
      })[0]
      .click();
  }

  function save() {
    mainCanvas.deactivateAll().renderAll();
    var c = document.getElementById('canvas1');
    var dataURL = c.toDataURL();
    var name = 'back';
    download(dataURL({
      multiplier: 2
    }), name + ".png");
    var c = document.getElementById('canvas2');
    var dataURL = c.toDataURL();
    var name = 'front';
    download(dataURL({
      multiplier: 2
    }), name + ".png");
  }

---

您需要将乘数属性传递给toDataURL。

奇怪的是，这似乎增加了图像的大小，但与我的工作代码不同，它几乎没有那么清晰。我不知道为什么，我会做进一步的调查。你知道为什么下载的.png文件会模糊不清吗？谢谢。@codeforever var c=document.getElementById'canvas1'；它是一张fabricjs帆布吗？是的，它是一张fabricjs帆布canvas@codeforever使用包含fabricjs canvas实例的变量。我在底部的问题中添加了我的fabricjs初始化。我想还是会有一次又一次的拉票，对吧？因为我们将两者都保存为单独的图像？

// Save
function download(url, name) {
  // make the link. set the href and download. emulate dom click
  $('<a>').attr({
    href: url,
    download: name
  })[0].click();
}

function downloadFabric(canvas, name) {
  //  convert the canvas to a data url and download it.
  download(activeCanvas.toDataURL({
    multiplier: 2
  }), name + '.png');
}

var mainCanvas, canvas1, canvas2, view = false;

$(function () {
  $viewText = document.querySelector("#viewText");
  canvas1 = new fabric.Canvas('canvas1', {
    preserveObjectStacking: true,
    lockUniScaling: true,
    centeredScaling: true
  });
  canvas2 = new fabric.Canvas('canvas2', {
    preserveObjectStacking: true,
    lockUniScaling: true,
    centeredScaling: true
  });
  canvas1.setHeight(412);
  canvas1.setWidth(637);
  canvas2.setHeight(412);
  canvas2.setWidth(637);
  changeView(1);

  // Center Line
  var line = new fabric.Line([canvas1.width / 2, 0, canvas1.width / 2, canvas1.height], {
    strokeWidth: 0.1,
    stroke: 'black',
    selectable: false,
  });
  canvas1.add(line);
  canvas2.add(line);
});

function save() {
  mainCanvas.deactivateAll().renderAll();
  //canvas1 fabric canvas insance
  var dataURL = canvas1.toDataURL({
    multiplier: 2
  });
  var name = 'back';
  download(dataURL, name + ".png");
  //canvas2 fabric canvas insance
  var dataURL = canvas2.toDataURL({
    multiplier: 2
  });
  var name = 'front';
  download(dataURL, name + ".png");
}