我无法使用函数 fromJSON 在 Rappid/jointJS 中加载自定义形状
I cannot load a custom shape in Rappid/jointJS using function fromJSON
在我的 Stencil 中,我有许多 basic.Circle 类型的形状,这些形状到目前为止使用类似于以下代码的代码效果很好:
new joint.shapes.basic.Circle({
size: { width: 5, height: 3 },
attrs: {
circle: { width: 50, height: 30, fill: '#602320' },
text: { text: 'START', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
}
})
例如,这段代码创建了这个形状:
现在我想创建一个具有完全相同属性但在该形状的定义中设置特定类型的形状 (type: "basic.Jump"
)
因此,新代码将如下所示:
new joint.shapes.basic.Circle({
type: 'basic.Jump',
size: { width: 5, height: 5 },
attrs: {
circle: { width: 50, height: 30, fill: '#1E90FF' },
text: { text: 'Jump', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
}
})
当我将这个形状添加到纸上时,它呈现得很好并且看起来像这样:
此形状可以成功保存为 JSON 但无法使用函数 fromJSON
加载它并且控制台错误如下:
我该如何克服这个问题?
我用一个非常聪明的方法解决了我的问题:
因为我的问题是我无法加载由形状 basic.Jump
组成的图表,现在在通过函数 fromjson
加载我的图表之前,我将这些形状的类型改为 basic.Circle 以便能够渲染图形,在成功渲染图形后,我再次将它们设置为 basic.Jump
现在我可以 Save/Load 图表而不会出现此错误。
在我的 Stencil 中,我有许多 basic.Circle 类型的形状,这些形状到目前为止使用类似于以下代码的代码效果很好:
new joint.shapes.basic.Circle({
size: { width: 5, height: 3 },
attrs: {
circle: { width: 50, height: 30, fill: '#602320' },
text: { text: 'START', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
}
})
例如,这段代码创建了这个形状:
现在我想创建一个具有完全相同属性但在该形状的定义中设置特定类型的形状 (type: "basic.Jump"
)
因此,新代码将如下所示:
new joint.shapes.basic.Circle({
type: 'basic.Jump',
size: { width: 5, height: 5 },
attrs: {
circle: { width: 50, height: 30, fill: '#1E90FF' },
text: { text: 'Jump', fill: '#ffffff', 'font-size': 10, stroke: '#000000', 'stroke-width': 0 }
}
})
当我将这个形状添加到纸上时,它呈现得很好并且看起来像这样:
此形状可以成功保存为 JSON 但无法使用函数 fromJSON
加载它并且控制台错误如下:
我该如何克服这个问题?
我用一个非常聪明的方法解决了我的问题:
因为我的问题是我无法加载由形状 basic.Jump
组成的图表,现在在通过函数 fromjson
加载我的图表之前,我将这些形状的类型改为 basic.Circle 以便能够渲染图形,在成功渲染图形后,我再次将它们设置为 basic.Jump
现在我可以 Save/Load 图表而不会出现此错误。