如何使用 mxgraph 设置自定义顶点答案

【问题标题】：How to set custom vertex using mxgraph如何使用 mxgraph 设置自定义顶点
【发布时间】：2014-08-29 02:36:14
【问题描述】：

我们正在编写一个使用mxgraph 生成图形的程序。我们的要求是“我们需要将图像显示为顶点”。我们尝试了许多代码，但我们无法获取图像。（图像的路径是正确的）我们可以改变节点的形状并添加颜色，但不能包含图像作为顶点。我们的代码如下

         Document xmlDocument = mxDomUtils.createDocument();
         Element sourceNode = xmlDocument.createElement("Source");
         Element targetNode = xmlDocument.createElement("Target");
         Element subtargetNode = xmlDocument.createElement("Subtarget");
         mxGraph graph = new mxGraph();
         Object parent = graph.getDefaultParent();
         graph.getModel().beginUpdate();
         try{
               Object v1 = graph.insertVertex(parent, null, "source", 20, 20,80, 30,"shape=ellipse");
               Object v2 = graph.insertVertex(parent, null, "destination", 200, 20,80, 30,"shape=image;image=H:\\mywork\\mxgraph\\bin\\mypack\\bg2.jpg");
               graph.insertEdge(parent, null, "", v1,v2,"startArrow=none;endArrow=diamond;strokeWidth=4;strokeColor=#66FF00");
         }

请指导我们在上面的代码中必须纠正什么以获得图像作为我的顶点。

【问题讨论】：

标签： mxgraph

【解决方案1】：

除了图像的路径，我在代码中看不到任何问题。即使您有足够的信心，也只需交叉检查图像的路径即可。在开发人员工具中打开它并检查您是否真的能够访问该图像。尝试直接从 url 访问图像。

这里的任何方式都是在 mxCells 上应用样式的推荐方式。

Document xmlDocument = mxDomUtils.createDocument();
     Element sourceNode = xmlDocument.createElement("Source");
     Element targetNode = xmlDocument.createElement("Target");
     Element subtargetNode = xmlDocument.createElement("Subtarget");
     mxGraph graph = new mxGraph();
     Object parent = graph.getDefaultParent();

     var style = new Object();
        style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
        style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
        style[mxConstants.STYLE_IMAGE] = 'images/bg2.jpg';
        style[mxConstants.STYLE_FONTCOLOR] = '#FFFFFF';
        graph.getStylesheet().putCellStyle('image', style)

     graph.getModel().beginUpdate();
     try{
           Object v1 = graph.insertVertex(parent, null, "source", 20, 20,80, 30,"shape=ellipse");
           Object v2 = graph.insertVertex(parent, null, "destination", 200, 20,80, 30,"image");
           graph.insertEdge(parent, null, "", v1,v2,"startArrow=none;endArrow=diamond;strokeWidth=4;strokeColor=#66FF00");
     }

【讨论】：