Question

我正在尝试识别每张图纸。

例如，在我绘制一个对象后，我希望该对象具有专有名称=“我的绘图1”，以便稍后通过

轻松引用它

canvas.getObjectByName('My Drawing Name');

getObjectByName函数

fabric.Canvas.prototype.getItemByName = function(name) {
    var object = null, objects = this.getObjects();

    for (var i = 0, len = this.size(); i < len; i++) {
        if (objects[i].name && objects[i].name === name) {
            object = objects[i];
            break;
        }
    }

    return object;
};

激活绘图功能的代码：

         canvas.isDrawingMode = true;

         var img = $("#patternImg")[0];

         var texturePatternBrush = new fabric.PatternBrush(canvas);
         texturePatternBrush.source = img;
         texturePatternBrush.selectable = true;
         texturePatternBrush.name = img.getAttribute("data-name");

         canvas.freeDrawingBrush = texturePatternBrush;
         canvas.freeDrawingBrush.width = img.getAttribute("data-height");

使用上面的代码，我可以检查是否可以通过以下方式验证绘图是否存在：

 fabric.Canvas.prototype.getDrawByName = function(name) {
    var object = null, objects = this.getObjects();

    for (var i = 0, len = this.size(); i < len; i++) {
        if (objects[i].canvas.freeDrawingBrush.name && objects[i].canvas.freeDrawingBrush.name === name) {
            object = objects[i];
            break;
        }
    }

    return object;
};

问题是每次我绘制一个具有另一个名称的对象时，canvas.FreeDrawingBrush.name对于我画布上的每个对象都是相同的。

我对FabricJS不太熟悉，我甚至不知道我想做什么甚至是可能的。至少我清楚自己要做的是什么？

Answer 1

访问canvas的{{1}}属性时，您只需获得对此对象呈现的fabric.Object元素的引用。此fabric.Canvas元素的freeDrawingBrush属性将始终是当前的免费绘图画笔。

相反，我会在完成绘图时将此fabric.Canvas属性设置到每个单独的对象上。（这可能是在您使用name方法退出绘图模式时，或者可能在您切换到其他画笔之前。

这样做，您不会以任何方式依赖对象的fabric.Object.set属性。

识别Fabric JS中的每个绘制路径

1 个答案: