将对象标识符分配给Fraine.js中的某些对象，然后将其保存为JSON

Question

我正在使用Fabric.js与画布进行交互。我需要分配一些对象唯一的ID，然后使用ID访问这些对象。

我从如何编程中选择Fraind.js对象并在Fabric.js

中获取以下代码

  var object = {
     id:   this.id,
  } 

现在，我使用以下代码动态地添加某些对象的ID：

for (i=0;i<10;i++)
{
  var rect = new fabric.Rect({
       left: 100,
       top: 100,
       fill: 'red',
        id: 'RECT'+i
       });
    alert(rect.id) //this is showing me the ids of each rectangle.
}

但是情况是我需要将这些ID保存在JSON中，因此，当我加载JSON时，我可以通过程序通过其ID访问对象。我尝试了以下代码：

  var json = JSON.stringify( canvas.toDataLessJSON(['id']) );

这样，我没有在JSON中获得ID。请向我建议一种可以将几个对象的ID保存到JSON中的方式。

Answer 1

这是一个工作的jsfiddle：http：//jsfiddle.net/rekrah/dw3bakkp/

尝试以下操作：var json = JSON.stringify(canvas.toJSON(['id']));

并从JSON加载画布并通过其ID访问对象：

var rectOne, rectTwo;  
canvas.loadFromJSON(json, function () {}, 
  function (o, object) {
    switch (object.id) {
        case 'RECT1':
            rectOne = object;
            break;            
        case 'RECT2':
            rectTwo = object;
            break;
        default:
            break;
    }
});

这是我组合的网站，它使用代码：

http://xpressclocks.azurewebsites.net/customize/abstract/liquid/white-paint-paint-splash-on-back-back-back-background