最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

flowchart - How to automatically apply flow layout when opening xml file in draw.iodiagrams.net? - Stack Overflow

programmeradmin1浏览0评论

Below is the content of a programmatically created xml file for draw.io.

I defined a flow layout for a parent element (id="1"), using style="childLayout=flowLayout;flowOrientation=west;".

If I open that file in draw.io, instead of applying the wanted flow layout, all elements are located at x=0, y=0:

If I slightly move one of the elements, the layout is applied/updated and I see the expected flow diagram:

=> How can I adapt the xml file to tell draw.io to immediately apply the wanted layout to the elements when opening the file?

I would like to avoid

a) that my users need to manually move elements to trigger the layout operation for the file

b) that I have to calculate explicit coordinates while creating the xml file for draw.io

If there is no xml option to trigger the layout operation, maybe there is some python or javascript api, that I could use as workaround: locally simulate opening the file, trigger the layout operation and save a new file, including explicit coordinate values?

draw_io_xml_file.drawio:

<?xml version="1.0" ?>
<mxfile host="app.diagrams">
  <diagram name="my flow chart">
    <mxGraphModel dx="1000" dy="1000" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="827" pageHeight="1169" math="0" shadow="0">
      <root>
        <mxCell id="0"/>
        <mxCell id="1" style="childLayout=flowLayout;flowOrientation=west;" parent="0"/>
        <object id="bus1" label="bus1">
          <mxCell style="shape=ellipse;whiteSpace=wrap;html=1;" vertex="1" parent="1">
            <mxGeometry as="geometry" width="80" height="80"/>
          </mxCell>
        </object>
        <object id="bus2" label="bus2">
          <mxCell style="shape=ellipse;whiteSpace=wrap;html=1;" vertex="1" parent="1">
            <mxGeometry as="geometry" width="80" height="80"/>
          </mxCell>
        </object>
        <object id="load1" label="load1" bus="bus2">
          <mxCell style="shape=rectangle;whiteSpace=wrap;html=1;" vertex="1" parent="1">
            <mxGeometry as="geometry" width="80" height="40"/>
          </mxCell>
        </object>
        <mxCell id="load1_edge" source="bus2" target="load1" edge="1" parent="1">
          <mxGeometry as="geometry"/>
        </mxCell>
        <object id="line1" label="line1" bus0="bus1" bus1="bus2">
          <mxCell source="bus1" target="bus2" edge="1" parent="1">
            <mxGeometry as="geometry"/>
          </mxCell>
        </object>
        <object id="gen1" label="gen1" bus="bus1">
          <mxCell style="shape=rectangle;whiteSpace=wrap;html=1;" vertex="1" parent="1">
            <mxGeometry x="0" y="0" as="geometry" width="80" height="40"/>
          </mxCell>
        </object>
        <mxCell id="gen1_edge" edge="1" source="gen1" target="bus1" parent="1">
          <mxGeometry as="geometry"/>
        </mxCell>
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

Edit: For the case, that this is not possible in draw.io, I also created a draw.io feature request here:

发布评论

评论列表(0)

  1. 暂无评论