Question

我必须创建自定义fabricjs对象（例如，fabric.Demo），扩展fabric.Group 对象。 fabric.Demo对象将用于分组其他两个fabric.Group对象。我在互联网上搜索过，发现只有这些链接有用。

Link 1
Link 2

但我收到这个错误'this._objects is undefined'。我知道我没有写_render（）。但我不明白在_render（）中编码的内容。如果有人知道答案，我们将不胜感激。

这是我的代码。

(function (global) {

    var fabric = global.fabric || (global.fabric = {}),
            extend = fabric.util.object.extend,
            clone = fabric.util.object.clone;

    var stateProperties = fabric.Text.prototype.stateProperties.concat();
    stateProperties.push(
            'top',
            'left'
            );

    fabric.Demo = fabric.util.createClass(fabric.Group, {
        type: 'demo',
        initialize: function () {

            this.grp = new fabric.Group([], {
                selectable: false,
                padding: 0
            });

            this.grp.add([
                new fabric.Group([
                    new fabric.Text('A', {top: 200, left: 200}),
                    new fabric.Text('B', {top: 200, left: 200})
                ]),
                new fabric.Group([
                    new fabric.Text('C', {top: 200, left: 200}),
                    new fabric.Text('D', {top: 200, left: 200})
                ])
            ]);
        },
        _render: function (ctx) {

        }
    });
})(typeof exports !== 'undefined' ? exports : this);

$(document).ready(function() {
    var canvas = new fabric.Canvas('c');
    var abc = new fabric.Demo();
    canvas.add(abc);
});

Answer 1

如果你想扩展Group，你必须尊重它的基本功能，渲染一大堆存储在person1数组中的对象。

因此，在初始化课程时，请不要创建_objects。

而是将您的2个组推送到this.grp数组中。

_objects

扩展渲染函数，考虑与标准组不同的需求，如果要加载和恢复画布，请不要忘记放置fromObject函数。

Answer 2

这是结构JS定制对象，其中使用了group。

var inputfrom = $("input[name^='plugin_options_time[from]']").attr(
      'name',
      'from'
    ); //set all the from name to 'from'

$.each(inputfrom, function (index, value) {
      $(value)
        .attr('name', 'plugin_options_time[from][' + index + ']')
        .prop('id', 'from-' + index + '');
    }); //reassign the correct id

如何创建自定义fabricjs对象？

2 个答案: