fabric.js點擊按鈕放大縮小畫布以及畫布內容

zoomIt = (factor) => { // factor： 比例
    const { canvas } = this.state;
    let cWidth = canvas.width;
    canvas.setWidth(cWidth * factor);
    canvas.setHeight(cWidth * factor);
　　 if(canvas.backgroundImage){
       var bi = canvas.backgroundImage;
       bi.width = bi.width * factor;
       bi.height = bi.height * factor;
    }
    var objects = canvas.getObjects();
    for (var i in objects) {
      var scaleX = objects[i].scaleX;
      var scaleY = objects[i].scaleY;
      var left = objects[i].left;
      var top = objects[i].top;
  
      var tempScaleX = scaleX * factor;
      var tempScaleY = scaleY * factor;
      var tempLeft = left * factor;
      var tempTop = top * factor;
  
      objects[i].scaleX = tempScaleX;
      objects[i].scaleY = tempScaleY;
      objects[i].left = tempLeft;
      objects[i].top = tempTop;
  
      objects[i].setCoords();
    }
    canvas.renderAll();
    canvas.calcOffset();
}

放大

this.zoomIt(1.1);

縮小

this.zoomIt(0.9);