jointjs - 使用 Rappid JS 在 BPMN 编辑器中添加新的模板选项

Question

我正在使用 Rappid JS 的试用版，它在 bpmn 编辑器中具有带有默认选项的模板。我需要在列表中添加新元素，以便我可以使用它并附加与之关联的检查器表单。

下面是我尝试过的代码。这是 POC 实现 Rappid JS 所必需的。

bpmn.js

stencil.load([
    new joint.shapes.bpmn.Gateway,
    new joint.shapes.bpmn.Activity,
    .
    .
    new joint,shapes.bpmn.myStencil
]);

检查器.js

window.inputs = {
    'bpmn.Gateway': {
        .
        .
    },
     .
     .
    'bpmn.myStencil':{
    //same as in-built Gateway code
    }
};

错误显示：

joint.shapes.bpmn.myStencil 不是构造函数。

Answer 1

我使用 bpmn.js 中的以下代码完成了它：

joint.shapes.basic.Rect = joint.shapes.basic.Generic.extend({
    markup: '<g class="rotatable"><g class="scalable"><rect class="body"/></g><text class="label"/></g>',

    defaults: joint.util.deepSupplement({
        type: 'basic.Rect',
        attrs: {
            'rect': { fill: 'white', stroke: 'black', 'follow-scale': true, width: 80, height: 40 },
            ".label":{text:"",ref:".body","ref-x":.5,"ref-dy":20,"y-alignment":"middle","x-alignment":"middle","font-size":14,"font-family":"Arial, helvetica, sans-serif",fill:"#000000"},
            'text': { 'font-size': 14, 'ref-x': .5, 'ref-y': .5, ref: 'rect', 'y-alignment': 'middle', 'x-alignment': 'middle' }
        }
    }, joint.shapes.basic.Generic.prototype.defaults)
});