我正在使用fabric.js API将64位基本图像加载到画布中。我需要做的是确定画布上的对象何时调整大小。我找不到有关事件在画布上的对象的任何文档。有没有办法监听这些对象上的事件？在画布或窗口上收听调整大小的操作无效：
$("canvas").on("resize", function () {
console.log("Resize occurred"); //not called
});
您在这里寻找的不是画布上的resize事件，除非您调整画布元素本身的大小，否则不会触发，而是画布上渲染的对象的resize事件。由于您正在使用fabricjs渲染图像，因此您可以监听fabricjs事件以获得所需的结果。您可以在此处找到所有fabricjs事件的概述。在您的情况下object:scaled将是听事件。以下可运行代码段说明了一个示例：
const canvas = new fabric.Canvas('canvas', {
selection: false
});
const imageElement = document.getElementById('image');
const img = new fabric.Image(imageElement, {
left: 20,
top: 20,
scaleX: 1,
scaleY: 1
});
canvas.add(img);
canvas.on('object:scaled', (options) => {
console.log(
"Object was scaled, current scaleX:",
options.target.scaleX,
" and scaleY: ",
options.target.scaleX)
});canvas {
border: 1px solid #000;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.4.0/fabric.min.js"></script>
<canvas id="canvas" width="300" height="200"></canvas>
<img style="display: none" id="image" src="https://images.unsplash.com/photo-1507146426996-ef05306b995a?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=200&q=80" />本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句