Javascript 画布对象上的Fabric JS事件
我正在使用fabric.js API将base 64图像加载到画布中。我需要做的是确定画布上的对象何时调整大小。我在画布上找不到任何关于对象事件的文档。有没有办法监听这些对象上的事件?侦听“在画布或窗口上调整大小”不起作用:Javascript 画布对象上的Fabric JS事件,javascript,html,html5-canvas,fabricjs,Javascript,Html,Html5 Canvas,Fabricjs,我正在使用fabric.js API将base 64图像加载到画布中。我需要做的是确定画布上的对象何时调整大小。我在画布上找不到任何关于对象事件的文档。有没有办法监听这些对象上的事件?侦听“在画布或窗口上调整大小”不起作用: $("canvas").on("resize", function () { console.log("Resize occurred"); //not called }); 这里您要查找的不是画布上的调整大小事件,除非调整画布元素本身的大小,否则不会触发该事件,
$("canvas").on("resize", function () {
console.log("Resize occurred"); //not called
});
这里您要查找的不是画布上的调整大小事件,除非调整画布元素本身的大小,否则不会触发该事件,而是画布上渲染的对象上的调整大小事件。由于您使用fabricjs渲染图像,因此可以收听fabricjs事件以获得所需的结果。您可以找到的所有fabricjs事件的概述。在您的情况下,
对象:缩放的
将是要收听的事件。以下可运行代码段演示了一个示例:
const canvas=new fabric.canvas('canvas'{
选择:false
});
常量imageElement=document.getElementById('image');
const img=新结构图像(imageElement{
左:20,,
前20名,
scaleX:1,
斯卡利:1
});
canvas.add(img);
canvas.on('对象:缩放',(选项)=>{
console.log(
对象已缩放,当前scaleX:,
options.target.scaleX,
“还有斯卡利:”,
options.target.scaleX)
});代码>
画布{
边框:1px实心#000;
}