Javascript 如何在JointJs中创建由2个或更多基本形状组成的自定义形状?

Javascript 如何在JointJs中创建由2个或更多基本形状组成的自定义形状?,javascript,jquery,svg,jointjs,Javascript,Jquery,Svg,Jointjs,我想在关节JS中创建一个形状 我可以对其进行初始化,假设矩形和圆形为一个形状 据我所知,唯一的路径方法是接近 我刚刚得到一个答案。我需要扩展joint.dia.Element类。下面是代码的外观,它绘制了一个带有两个圆的矩形(扩展): Andrius,如何创建模具数据?这些代码行在文档graph=new joint.dia.graph var paper=new joint.dia.paper({el:$('#paper1')、宽度:1000、高度:1000、网格大小:1、模型:graph})中

我想在关节JS中创建一个形状

我可以对其进行初始化,假设矩形和圆形为一个形状


据我所知,唯一的路径方法是接近

我刚刚得到一个答案。我需要扩展joint.dia.Element类。下面是代码的外观,它绘制了一个带有两个圆的矩形(扩展):


Andrius,如何创建模具数据?这些代码行在文档
graph=new joint.dia.graph var paper=new joint.dia.paper({el:$('#paper1')、宽度:1000、高度:1000、网格大小:1、模型:graph})中给出得非常清楚
var stencilData=newjoint.ui.Stencil({图形:图形,纸张:纸张,宽度:500,高度:500});
joint.shapes.basic.myShape = joint.dia.Element.extend({

            markup: '<g class="rotatable"><g class="scalable"><rect class="outer"/><circle class="inner"/><circle class="inner1"/></g></g>',
            defaults: joint.util.deepSupplement({
                type: "basic",
                size: {
                    width: 20,
                    height: 20
                },
                attrs: {
                    ".outer": {
                        stroke: 'black',
                        'fill-opacity': 1,
                        width: 10,
                        height: 15
                    },
                    ".inner": {
                        transform: "translate(10, 10)",
                        r: 8,
                        fill: "#000000"
                    },
                    ".inner1": {
                        transform: "translate(10, 10)",
                        r: 6,
                        fill: "#fff"
                    }
                }
            }, joint.dia.Element.prototype.defaults)
});
 var r1 = new joint.shapes.basic.myShape({
            size: {
                width: 60,
                height: 60
            }
        });

 stencilData.load([r1], 'basic');