私はファブリックイベントで奇妙な問題に直面しています。このスニペットをご覧くださいオブジェクト:removedイベントが実行されません - Fabric JS
canvas.on('object:added', function(e) {
console.log(e.target.type);
console.log("Something was Added");
});
canvas.on('object:removed', function(e) {
console.log(e.target.type);
console.log("Something was removed");
});
このコードベースでは、元に戻す/やり直しの機能を試しています。両方とも元に戻す& redoは、オブジェクトを追加、変更、削除することができます。キャンバス内で何かが追加または削除された場合(この段階で変更されたオブジェクトについてあまり心配していません)、通知を受けたいと思います。
しかし、元に戻す/やり直し機能を使用してキャンバスにオブジェクトを追加したり、キャンバスからオブジェクトを削除したりしても、変なことはありません。 私は常に出力を得る - 何かが
アンドゥ/リドゥルーチンを追加しました:
// Undo Redo Clear
canvas.counter = 0;
var newleft = 0;
canvas.selection = false;
var state = [];
var mods = 0;
canvas.on(
'object:modified', function() {
updateModifications(true);
},
'object:added', function() {
updateModifications(true);
},
'object:removed' , function(e){
updateModifications(true);
console.log('test me');
});
function updateModifications(savehistory) {
if (savehistory === true) {
myjson = JSON.stringify(canvas);
state.push(myjson);
console.log(myjson);
}
}
undo = function undo() {
if (mods < state.length) {
canvas.clear().renderAll();
canvas.loadFromJSON(state[state.length - 1 - mods - 1]);
canvas.renderAll();
mods += 1;
//check_team();
//compare_states(state[state.length - 1 - mods - 1] , state[state.length - 1 - mods + 1])
}
//make_objects_selectable();
}
redo = function redo() {
if (mods > 0) {
canvas.clear().renderAll();
canvas.loadFromJSON(state[state.length - 1 - mods + 1]);
canvas.renderAll();
mods -= 1;
//check_team();
}
//make_objects_selectable();
}
clearcan = function clearcan() {
canvas.clear().renderAll();
newleft = 0;
}
ファブリックバージョン: "1.6.0-rc.1"
更新:イベントが正常に動作しています通常の削除操作の場合。そこで私は、元に戻すとやり直しルーチンを追加しました。
よろしく
うん、そうかもしれない。あなたは手で問題を克服するために何を提案しますか?私はオブジェクトが現在の状態から削除されているかどうかを知る必要があります。私は何とかjsonオブジェクトを比較し、欠けているものを見つけ出すと考えていました。しかしそれはそれの考えによって退屈なように聞こえる。 –
私はあなたがあなたのアプローチでそれを達成できるとは思わない。各「状態スロット」にキャンバス全体のプレーンなシリアル化を保存するだけで、個々のオブジェクトを照会するのは困難です。私は、キャンバス全体のストレージではなく、個々のオブジェクトとアクションを持つスタックに基づいた私のソリューションで、最新の回答(後日)をお届けします。 –
これは非常に役に立ちます –