FabricJS getCircle по идентификатору или имени

Question

Я создаю несколько объектов окружности, каждый с уникальным именем (или id). Когда я хочу выбрать объект, мне нужно выполнить поиск по всем объектам окружности и вернуть правильный объект. Со многими объектами это не очень хорошо для производительности, я думаю. Есть ли способ выбрать объект по уникальному атрибуту?

Я создал простой JSFiddle, чтобы показать мой текущий обходной путь, чтобы получить круг объекта: https://jsfiddle.net/t47vvtec/5/

Я сравнить каждый объект с атрибутом, и если один соответствует его, объект будет возвращен. Может быть, вы можете помочь мне найти более легкое решение.

Вот мой код, чтобы получить объект до сих пор:

function getPoint(name) 
{ 
    var line_point_array = canvas.getObjects('circle'); 

    for (var i = 0; i < line_point_array.length; i++) { 
     var point = line_point_array[i]; 

     if (point.name == name) { 
      return point; 
     } 
    } 
} 

Спасибо :)

Answer 1

Вы могли бы попробовать что-то вроде (https://jsfiddle.net/cssimsek/akbe97c5/1/):

var FabricCanvasObject = function(canvasId, attrSet) { 
    this.theCanvas = new fabric.Canvas(canvasId, attrSet); 
    this.addShape = function(shapeAttrSet) { 
     var newShape = this.theCanvas.add(new fabric.Circle(shapeAttrSet)); 
     this.canvasElements.length += 1; 
     this.canvasElements[shapeAttrSet.name + this.canvasElements.length] = newShape; 
    }; 
    this.canvasElements = { length: 0 }; 
}; 
var myFabric = new FabricCanvasObject('c', { 
    targetFindTolerance: 15 
}); 
console.log(myFabric); 
myFabric.addShape({ 
    radius: 20, 
    fill: 'green', 
    left: 100, 
    top: 100, 
    name: 'circle', 
    id: 1 
}); 
myFabric.addShape({ 
    radius: 20, 
    fill: 'red', 
    left: 150, 
    top: 150, 
    name: 'circle', 
    id: 2 
}); 
myFabric.addShape({ 
    radius: 20, 
    fill: 'blue', 
    left: 200, 
    top: 200, 
    name: 'circle', 
    id: 3 
}); 
console.log(myFabric.canvasElements); 
console.log(myFabric.canvasElements.circle1);