Fabric.js颜色在子类fabric.Group中将变为黑色

问题描述

我正在尝试将fabric.Group子类化，并将JSON字符串加载到其中.我遇到的问题是子类组中fabric.Rect的颜色正变为黑色.当我直接在fabric.Group中进行操作时，效果很好.我一直在玩fromObject的变体，但似乎无法弄清楚我在做什么错.当我激活"组中的对象时，似乎发生了更改.

I am trying to subclass fabric.Group and load a JSON string into it.The problem I'm having is that the color of the fabric.Rect in the subclassed group is getting changed to black.When I do it directly in fabric.Group it works great. I've been playing with variations on fromObject but I can't seem to figure out what I'm doing wrong. The change seems to happen when I "enliven" the objects in the group.

这里是一个小提琴，展示了我的问题 https://jsfiddle.net/adgu/49feomm7/
单击加载组"按钮以查看红色矩形(正确)，单击加载自定义组"按钮以查看黑色矩形.JSON相同，除了一种情况是"group"，另一种情况是"customGroup".

Here is a fiddle demonstrating my problem https://jsfiddle.net/adgu/49feomm7/
Click on the "Load Group" button to see the red rect (which is correct) and the "Load Custom Group" button to see the black rect. The JSON is identical with the exception of the type being 'group' in one case and 'customGroup' in the other.

fabric.CustomGroup = fabric.util.createClass(fabric.Group, {

  type: 'customGroup',

  initialize: function(objects, options) {
    options || (options = { });    
    //console.log('initialize objects', objects);
    //console.log('initialize options', options);
    this.callSuper('initialize', objects, options);    
  },

  toObject: function() {
    return fabric.util.object.extend(this.callSuper('toObject'), {
    });
  },

  _render: function(ctx) {
    this.callSuper('_render', ctx);
  }
});

fabric.CustomGroup.fromObject = function(object, callback) {   
   //console.log('fromObject', object);
   var _enlivenedObjects;
   fabric.util.enlivenObjects(object.objects, function (enlivenedObjects) {
      //console.log('enlivenObjects object', object);
      //console.log('enlivenObjects object.objects', object.objects);      
      //console.log('enlivenObjects enlivenedObjects', enlivenedObjects);
      delete object.objects;    
      _enlivenedObjects = enlivenedObjects;
   });
   return new fabric.CustomGroup(_enlivenedObjects, object);   
};

推荐答案

我发现了一个已解决问题的封闭错误报告: https://github.com/kangax/fabric.js/issues/3156

I found a closed bug report that addressed my problem: https://github.com/kangax/fabric.js/issues/3156

通过将true添加到初始化callSuper的末尾，它开始工作.像这样:

By adding true to the end of the initialize callSuper it started working. Like this:

this.callSuper('initialize', objects, options, true);

这篇关于Fabric.js颜色在子类fabric.Group中将变为黑色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！