從FabricJS中的組中刪除/替換對象

Question

我正在嘗試從一個組中替換SVG（或刪除並添加一個新的SVG），但是它不起作用。 這些是我已經嘗試過的方法：

var group = new fabric.Group([svg, text], {options});

canvas.remove(svg); // not working

group.getObjects()[0] = my_new_svg; // not working

group.forEachObject(function(o) { // not working
    if (is_svg_object) {
        canvas.remove(o);
    }
});

我一直在使用version 1.6.4 ，它的工作真的很好。 但是現在，我正在遷移到最新版本1.7.17並1.7.17這個問題。

我還注意到，在此版本中，我無法直接設置屬性，我被迫使用該方法。

object.setTextBackgroundColor(color); // works

object.textBackgroundColor = color; // works in 1.6, not in 1.7.17

所以我認為這個問題可能是相關的。 謝謝！

Answer 1

從1.7.x開始，有很多事情要考慮。

1）默認情況下，您獲得對象緩存。 這意味着，當某些變化時，織物將繪制對象。 如果您沒有要求更好地說明以下內容，則應仔細閱讀以下內容：

http://fabricjs.com/fabric-object-caching

2）要使更改生效，您可以通過3種方式解決：

使用您所描述的setter方法（最好在.set('textBackgroundColor', color)版本中使用）

更改后將對象標記為臟（object.set（'dirty'，true））

禁用objectCaching（不建議）

3）從組中刪除對象的正確方法是

var group = new fabric.Group([svg, text], {options});

group.remove(svg);

group.addWithUpdate(my_new_svg);

group.moveTo(my_new_svg, 0);

老實說，看看什么是行不通的，為什么會給你一個更好的答案。