向fabricjs对象添加自定义属性 [英] adding custom attributes to fabricjs object

问题描述

我试图将自定义属性添加到我拥有的结构js对象：

Im trying to add a custom attribute to a fabric js object that i have:

var trimLine = new fabric.Rect({
    width: Math.round(obj.box_dimensions.box.width,2),
    height: Math.round(obj.box_dimensions.box.height,2),
    strokeWidth: 1,
    stroke: 'rgb(255,2,2)',
    fill: '',
    selectable: false
});

这样我的矩形我试图添加，我想在其中传递一个名称或ID是能够在我获得canvas对象并将其转换为json时识别它。

so thats my rectangle im trying to add and i want to pass a name or id in it to be able to identify it later when i get the canvas object and convert it to a json.

我已经尝试过做了

var trimLine = new fabric.Rect({
    width: Math.round(obj.box_dimensions.box.width,2),
    height: Math.round(obj.box_dimensions.box.height,2),
    strokeWidth: 1,
    stroke: 'rgb(255,2,2)',
    fill: '',
    selectable: false,
    name: trimLine
});

canvas.add(trimLine);
canvas.renderAll();

它不起作用我也试过了

 trimline.name = 'trimLine'

推荐答案

对于那些遇到同样问题的人，我通过以下方式解决了这个问题：

For those that run into the same issue the way i solved this is by doing the following:

            var trimLine = new fabric.Rect({
                width: Math.round(obj.box_dimensions.trimbox.width,2),
                height: Math.round(obj.box_dimensions.trimbox.height,2),
                strokeWidth: 1,
                stroke: 'rgb(255,2,2)',
                fill: '',
                selectable: false
            });

就在它下面我添加了这段代码：

right below it i added this code:

           trimLine.toObject = function() {
                return {
                    name: 'trimline'
                };
            };

      canvas.add(trimLine);
      canvas.renderAll();

所以现在当我将画布转换为json时，trimline对象只返回名称，这就是我的全部需要。当然，您也可以添加您需要的任何其他信息。

So now when i convert the canvas to a json the trimline object only returns the name which is all i need. Of course you can also add any other info you need as well.

这篇关于向fabricjs对象添加自定义属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！