使用对其他对象的引用序列化fabricjs画布

Question

根据解释here

如何在fabricjs中使用json我已经编写了一些代码来序列化和反序列化我的fabricjs画布。但它不起作用，我认为困难在于我的线条具有三角形属性。当反序列化一条线时，相关的三角形可能还不存在，所以我不会感到惊讶的是它们在完成之后似乎与这些线无关。我该如何解决这个问题？我应该给每个三角形一个名称，以便我可以在反序列化后找到它并将其设置为该线的适当三角形吗？或者是继续前进的方式？谢谢。

var line = new fabric.Line([0, 0, 0, 0], {
        fill: '#444',
        stroke: '#444',
        strokeWidth: 2,
        id: 'arrow',
        name: 'arrow',
        selectable: true,       //if turn this off hovercursor doesn't work. So arrow is selectable. But setting hasBorders to false stops blue rectangle appearing around it so there's no problem.
        lockMovementX: true,
        lockMovementY: true,
        lockScalingX: true,
        lockScalingY: true,
        lockRotation: true,
        strokeDashArray:[10,5],
        hasControls: true,
        lockRotation: true,
        hasBorders: false,
        sourceObject: sourceObject,
        targetObject: targetObject,
        offset: offset,
        cornerColor: 'rgba(255,0,0,1)',
        stateProperties: ['triangle'],
    });

    /** [Create triangle attached to the end of the line  */
    line.triangle = new fabric.Triangle({
        originX: 'left',
        originY: 'top',
        selectable: true,
        hasBorders: true,
        hasControls: true,
        lockScalingX: true,
        lockScalingY: true,
        lockRotation: true,
        hasControls: false,
        lockRotation: true,
        pointType: 'arrow_start',
        width: TRI_WIDTH,
        height: TRI_HEIGHT,
        fill: '#444',
        selectable: false,
    });

    setxy(line, offset);

    line.toObject = (function(toObject) {
      return function() {
        return fabric.util.object.extend(toObject.call(this), {
          triangle: this.triangle
        });
      };
    })(line.toObject);

    canvas.add(line, line.triangle);