mxGraph 图像节点边缘
mxGraph image node edges
我正在使用以下代码在 mxGraph 中创建图像节点。
var style = graph.getStylesheet().getDefaultVertexStyle();
style[mxConstants.STYLE_SHAPE] = mxConstants.STYLE_IMAGE;
style[mxConstants.STYLE_IMAGE] = 'images/sourceIcon_Sample2.png;';
mxConstants.VERTEX_SELECTION_COLOR = '#FFFFFF';
开始更新
var v1 = graph.insertVertex(parent, null, "Obj1", 70, 130, width, height,"");
var v2 = graph.insertVertex(parent, null, "Obj2", 70, 130, width, height,"");
graph.insertEdge(parent, null, "", v1, v2);
这首先正确地创建了我的节点,但是在我移动节点之后,边缘似乎没有到节点。请参考下图。
现在我明白边缘实际上附加到节点但是因为图像节点它看起来像这样,但我的问题是我可以避免它吗?
或者有没有办法使用 shape=circle
并将图像放入其中。我不想改变图表的外观,我还支持其他形状,例如带图像的六边形、带图像的矩形。
配置周边样式如下:
style[mxConstants.STYLE_PERIMETER] = 'ellipsePerimeter'
我正在使用以下代码在 mxGraph 中创建图像节点。
var style = graph.getStylesheet().getDefaultVertexStyle();
style[mxConstants.STYLE_SHAPE] = mxConstants.STYLE_IMAGE;
style[mxConstants.STYLE_IMAGE] = 'images/sourceIcon_Sample2.png;';
mxConstants.VERTEX_SELECTION_COLOR = '#FFFFFF';
开始更新
var v1 = graph.insertVertex(parent, null, "Obj1", 70, 130, width, height,"");
var v2 = graph.insertVertex(parent, null, "Obj2", 70, 130, width, height,"");
graph.insertEdge(parent, null, "", v1, v2);
这首先正确地创建了我的节点,但是在我移动节点之后,边缘似乎没有到节点。请参考下图。
现在我明白边缘实际上附加到节点但是因为图像节点它看起来像这样,但我的问题是我可以避免它吗?
或者有没有办法使用 shape=circle
并将图像放入其中。我不想改变图表的外观,我还支持其他形状,例如带图像的六边形、带图像的矩形。
配置周边样式如下:
style[mxConstants.STYLE_PERIMETER] = 'ellipsePerimeter'