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);

浙公网安备 33010602011771号