Как определить, когда содержимое холста было изменено?

Question

Мне нужно посмотреть изменения в объекте canvas (я использую библиотеку fabricjs).

var canvas = this.__canvas = new fabric.Canvas('canvas', {isDrawingMode:true}); 
//I need to watch the changes here -> 
canvas.toJSON(); 

Я стараюсь с Object.prototype.watch() как:

canvas.toJSON.watch ('объектов', функции() {// DoSomething});

Но это не сработало для меня, любая помощь?

Answer 1

Поскольку ваш пример упоминается isDrawingMode:true Я думаю, что вы ищете способ обнаружить рисунок на холсте вас в свободном режиме ручного управления.

Fabric JS выставляет длинный список событий, как вы можете прочитать here.

Так что, если вы хотите обнаружить свободный рисунок на своем холсте, вы можете использовать событие path:created.

var canvas = new fabric.Canvas('canvas',{isDrawingMode:true}); 
 
canvas.on('path:created', function(event) { 
 
    //log the svg path info 
 
    console.log(event.path.path); 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.6.4/fabric.min.js"></script> 
 
<canvas id="canvas" width="300" height="300"></canvas>

Answer 2

Холст называет его собственными событиями, указанными в этом документе: Class: Canvas, где вы увидите много событий, из которых исходит холст.

события для проверки, если объект изменяются ниже:

canvas.on('object:modified', function(event) { 
    // the object that has been modified is in: 
    event.target 
})