2013-07-01 95 views
3

我對如何將圖導出到svg或graphml有點困惑。 forum.jgraph.com上的api,示例或線程都沒有幫助我,直到現在。如何將圖導出到svg/graphml

我需要將圖導出到svg和graphml。即使使用正確的佈局,我也可以使用svg來顯示節點和邊緣,但我缺少節點名稱和指定顏色等信息。

隨着graphml我還沒有線索,但如何獲得正確的XML代碼,甚至顯示一個功能圖。

是否有任何指南/工作流程可能會幫助我在JGraphX中導出?

在此先感謝您的幫助,

克里斯

+0

你有沒有發現過? – Kayvar

回答

3

爲了節省您的圖形,你必須調用mxCellRendered來渲染圖形從中您得到您的文檔(DOM文檔)一mxicanvas。 從渲染器它是這樣的: mxGraph.drawCell() - > mxGraph.drawState() - > mxICanvas.drawCell() - > mxICanvas.drawShape() mxICanvas只知道單元格的幾何和樣式。

我想在SVG文件添加以及小區ID屬性,所以我做了以下

  1. 延長mxGraph覆蓋drawCell(),以增加該小區ID中的風格細胞和
  2. 延長mxSvgCanvas添加對我感興趣

功能保存爲SVG圖形形狀的id屬性是這樣:

// use the extended svg canvas, where the cell id is added as attribute 
public void createSVG(mxGraphExtended g) { 
    String filename = "\home\koula\graph.svg"; 
    mxSvgCanvasExtended canvas = (mxSvgCanvasExtended) mxCellRenderer.drawCells(
    g, null, 1, null, new CanvasFactory() { 
    public mxICanvas createCanvas(int width, int height) { 
     mxSvgCanvasExtended canvas = new mxSvgCanvasExtended(mxDomUtils 
      .createSvgDocument(width, height)); 
      canvas.setEmbedded(true); 
      return canvas; 
     } 
    }); 
    try { 
    mxUtils.writeFile(mxXmlUtils.getXml(canvas.getDocument()), filename); 
    } catch (IOException e) { 
    e.printStackTrace(); 
    } 
} 

將被覆蓋的drawCell():

public class mxGraphExtended extends mxGraph { 

    @Override 
    public void drawCell(mxICanvas canvas, Object cell) { 
     // add the cell's id as a style attribute 
     // cause canvas only get the style and geometry 
     mxCellState state = this.getView().getState(cell); 
     state.getStyle().put("cellid", ((mxCell)cell).getId()); 

     super.drawCell(canvas, cell); 
    } 
} 

的覆蓋drawShape()是這樣:

public class mxSvgCanvasExtended extends mxSvgCanvas { 

    //... have coppied only the related code 

    @Override 
    public Element drawShape(int x, int y, int w, int h, 
     Map<String, Object> style) 
    { 
     //... 

     // Draws the shape 
     String shape = mxUtils.getString(style, mxConstants.STYLE_SHAPE, ""); 
     String cellid = mxUtils.getString(style, "cellid", ""); 
     Element elem = null; 
     // ... 

     // e.g. if image, add the cell id 
     if (shape.equals(mxConstants.SHAPE_IMAGE)) { 
      String img = getImageForStyle(style); 
      if (img != null) { 
       // Vertical and horizontal image flipping 
       boolean flipH = mxUtils.isTrue(style, 
        mxConstants.STYLE_IMAGE_FLIPH, false); 
       boolean flipV = mxUtils.isTrue(style, 
        mxConstants.STYLE_IMAGE_FLIPV, false); 
       elem = createImageElement(x, y, w, h, img, 
        PRESERVE_IMAGE_ASPECT, flipH, flipV, isEmbedded()); 
       /* so here we are */ 
       // add the cell id atribute 
       if(!cellid.equals("")) { 
        elem.setAttribute("id", cellid); 
       } 
      } 
     } else if (shape.equals(mxConstants.SHAPE_LINE)) 
      // ... 
     }// end drawShape 

    } // end class 

希望這有助於。

+0

謝謝你這個答案,你介意看看https://stackoverflow.com/questions/44179673/drawio-mxgraph-using-xmltosvg-loses-shapes-information 看起來像我的SVG失去轉換後的形狀信息 –