使用Fabric.js框架时出现问题。 我需要制作它,使其显示如下图所示,
https://i.stack.imgur.com/mqNl4.png
但是我的代码在这里
var dims = path._calcDimensions();
this.gun.set({
strokeWidth: 3 * camera.z,
width: dims.width,
height: dims.height,
pathOffset: {
x: dims.width / 2 + dims.left,
y: dims.height / 2 + dims.top
}
});
console.log(this.gun.getBoundingRect());
this.gun.setCoords();
this.gun.set({path: path.path});
使其始终位于路径图像的中间。
https://i.stack.imgur.com/HpLBE.png
如果我调整中心,则路径会被剪掉。
this.gun.set({
strokeWidth: 3 * camera.z,
width: dims.width,
height: dims.height,
/*pathOffset: {
x: dims.width / 2 + dims.left,
y: dims.height / 2 + dims.top
}*/
});
https://i.stack.imgur.com/nvKM3.png
图片中的矩形是边界框
canvas.on('after:render', function() {
canvas.contextContainer.strokeStyle = '#555';
canvas.forEachObject(function(obj) {
var bound = obj.getBoundingRect();
//console.log(bound);
canvas.contextContainer.strokeRect(
bound.left + 0.5,
bound.top + 0.5,
bound.width,
bound.height
);
})
});
Halp plz!