fabric.js最簡單的方式來縮放整個圖像

Question

我在客戶端使用fabric.js允許用戶在瀏覽器中創建圖像，然後fabric.js序列化圖像到json併發送到節點服務器。那麼後端將JSON字符串反序列化爲一個對象，並將該圖像保存爲本地文件。

的問題是：

結果圖像必須是大的，例如3000x3000px， 現在我使用<canvas width="600" height="600"></canvas> 用戶上傳的背景圖像（3000x3000）到畫布，然後我縮放這樣說：

fabric.Image.fromURL(data, function (img) { 
      img.scale(0.2);    
      canvas.add(img).renderAll();    
     }); 

它填充整個畫布。

然後用戶將文本添加到畫布上，例如偏移x，y：100,200，然後單擊提交按鈕。服務器必須將600x600圖像未標定爲3Kx3K，還要對文本進行未縮放並重新計算偏移量。有沒有最簡單的方法來操縱縮放？

Answer 1

儘量保持圖像在刻度1 檢測圖像應該得到多少縮放，縮放整個畫布，而不是：一旦

canvas.setZoom(0.2) 

當你在節點的環境中，你裝返回圖像，將畫布尺寸設置爲圖像尺寸。

縮放不會導出到json，因此您不必更改任何東西。

您應該獲得與圖像一樣大的畫布，並保存所有比例。