首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在jointJS - Rappid中添加新的检查器(元素和链接检查器除外)

如何在jointJS - Rappid中添加新的检查器(元素和链接检查器除外)
EN

Stack Overflow用户
提问于 2017-12-04 15:21:37
回答 1查看 879关注 0票数 1

我想添加第三个检查器,它将只为特定类型的元素(而不是链接)打开,例如,只打开basic.Rect中的Rappid。

到目前为止,有两个Inspectors.For元素和链接。

有什么办法可以做到吗?

下面的代码是Rappid KitchenSkink版本的一部分。

这是函数createInspector:

代码语言:javascript
运行
复制
createInspector: function(cellView) {

    var cell = cellView.model || cellView;

    // No need to re-render inspector if the cellView didn't change.
    if (!this.inspector || this.inspector.options.cell !== cell) {

        // Is there an inspector that has not been removed yet.
        // Note that an inspector can be also removed when the underlying cell is removed.
        if (this.inspector && this.inspector.el.parentNode) {

            this.inspectorClosedGroups[this.inspector.options.cell.id] = _.map(app.inspector.$('.group.closed'), function(g) {
        return $(g).attr('data-name');
    });

            // Clean up the old inspector if there was one.
            this.inspector.updateCell();
            this.inspector.remove();
        }

        var inspectorDefs = InspectorDefs[cell.get('type')];

        this.inspector = new joint.ui.Inspector({
            inputs: inspectorDefs ? inspectorDefs.inputs : CommonInspectorInputs,
            groups: inspectorDefs ? inspectorDefs.groups : CommonInspectorGroups,
            cell: cell
        });

        this.initializeInspectorTooltips();

        this.inspector.render();
        $('.inspector-container').html(this.inspector.el);

        if (this.inspectorClosedGroups[cell.id]) {

    _.each(this.inspectorClosedGroups[cell.id], this.inspector.closeGroup, this.inspector);

        } else {
            this.inspector.$('.group:not(:first-child)').addClass('closed');
        }
    }
}
EN

回答 1

Stack Overflow用户

发布于 2018-03-01 12:20:54

如果使用joint.ui.Inspector.create('#path', inspectorProperties),则删除特定DOM元素中检查器的任何以前的实例,并自动创建新的实例并将其呈现到DOM中(它避免创建joint.ui.Inspector()的新实例、呈现它、手动添加呈现的结果和删除前一个实例)。

它还跟踪打开/关闭的组,并根据上次使用的状态恢复它们。

此外,在准备对检查器进行inspectorProperties时,您可能总是有几个以前定义的不同的create()对象。因此,按照您粘贴的代码,您可以首先执行所需的测试,然后创建适当的检查器:

代码语言:javascript
运行
复制
if(cell instanceof joint.basic.Rect){

  var customInputs = _.clone(CommonInspectorInputs);
  // extend more inputs into `customInputs` from a variable previously defined
  // OR modify the default rectangle's inspector directly, example:
  customInputs.attrs.text = {
    type: 'textarea',
    label: 'Multiline text',
    text: 'Type\nhere!',
    group: joint.util.getByPath(CommonInspectorInputs.attrs, 'text/group', '/');
  };

  joint.ui.Inspector.create('.extra-inspector-container', {
    cell: cell
    inputs: customInputs,
    groups: CommonInspectorGroups,
  });
} // if only ONE inspector needs to be loaded add an ELSE block here
  // and use '.inspector-container' in the `create()` above

// If `InspectorDefs` is a global variable with all the cells inspectors properties
// create and load the default inspector
joint.ui.Inspector.create('.inspector-container', _.extend({cell: cell},
  InspectorDefs[cell.get('type')])
);
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/47636547

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档