| <mxEditor defaultGroup="group" defaultEdge="connector"> |
| <!-- |
| The following line is used to dynamically add a configuration hook for various backends. |
| The hook must have an ASP.NET extension because IIS does not handle any other extensions. |
| In the Dotnet and Java server examples, this hook is implemented so that it returns the |
| required configuration for using a backend, namely, the diagrameditor-backend.xml |
| in the java and dotnet directories, respectively. |
| --> |
| <include name="/Config.ashx"/> |
| <include name="config/editor-commons.xml"/> |
| <add as="onInit"><![CDATA[ |
| function () |
| { |
| onInit(this); |
| } |
| ]]></add> |
| <ui> |
| <add as="graph" element="graph"/> |
| <add as="status" element="status"/> |
| <add as="toolbar" element="toolbar"/> |
| </ui> |
| <Array as="templates"> |
| <add as="group"> |
| <Group label="" href=""> |
| <mxCell vertex="1" style="group" connectable="0"/> |
| </Group> |
| </add> |
| <add as="connector"> |
| <Connector label="" href=""> |
| <mxCell edge="1"> |
| <mxGeometry as="geometry" relative="1"/> |
| </mxCell> |
| </Connector> |
| </add> |
| <add as="container"> |
| <Container label="Container" href=""> |
| <mxCell vertex="1" style="swimlane" connectable="0"> |
| <mxGeometry as="geometry" width="200" height="200"/> |
| </mxCell> |
| </Container> |
| </add> |
| <add as="rectangle"> |
| <Rect label="Rectangle" href=""> |
| <mxCell vertex="1"> |
| <mxGeometry as="geometry" width="80" height="40"/> |
| </mxCell> |
| </Rect> |
| </add> |
| <add as="text"> |
| <Text label="Text Here" href=""> |
| <mxCell vertex="1" style="text"> |
| <mxGeometry as="geometry" width="80" height="20"/> |
| </mxCell> |
| </Text> |
| </add> |
| <add as="image"> |
| <Image label="" href=""> |
| <mxCell vertex="1" style="image"> |
| <mxGeometry as="geometry" width="80" height="50"/> |
| </mxCell> |
| </Image> |
| </add> |
| <add as="rounded"> |
| <Roundrect label="Rounded" href=""> |
| <mxCell vertex="1" style="rounded"> |
| <mxGeometry as="geometry" width="80" height="40"/> |
| </mxCell> |
| </Roundrect> |
| </add> |
| <add as="shape"> |
| <Shape label="Shape" href=""> |
| <mxCell vertex="1" style="ellipse"> |
| <mxGeometry as="geometry" width="60" height="60"/> |
| </mxCell> |
| </Shape> |
| </add> |
| <add as="actor"> |
| <Shape label="Shape" href=""> |
| <mxCell vertex="1" style="actor"> |
| <mxGeometry as="geometry" width="40" height="60"/> |
| </mxCell> |
| </Shape> |
| </add> |
| <add as="cloud"> |
| <Shape label="Shape" href=""> |
| <mxCell vertex="1" style="cloud"> |
| <mxGeometry as="geometry" width="80" height="60"/> |
| </mxCell> |
| </Shape> |
| </add> |
| <add as="hline"> |
| <Shape label="" href=""> |
| <mxCell vertex="1" style="ellipse"> |
| <mxGeometry as="geometry" width="60" height="10"/> |
| </mxCell> |
| </Shape> |
| </add> |
| </Array> |
| <mxGraph as="graph" alternateEdgeStyle="verticalConnector" allowLoops="1" dropEnabled="1"> |
| <add as="isAutoSizeCell"><![CDATA[ |
| function(cell) |
| { |
| return mxUtils.isNode(this.model.getValue(cell), 'text'); |
| } |
| ]]></add> |
| <add as="isSwimlane"><![CDATA[ |
| function (cell) |
| { |
| return mxUtils.isNode(this.model.getValue(cell), 'container'); |
| } |
| ]]></add> |
| <add as="getTooltipForCell"><![CDATA[ |
| function(cell) |
| { |
| return '<b>'+cell.getAttribute('label')+ |
| '</b> ('+cell.getId()+')'+ |
| '<br>Style: '+cell.getStyle()+ |
| '<br>Connections: '+cell.getEdgeCount()+ |
| '<br>Children: '+cell.getChildCount(); |
| } |
| ]]></add> |
| <add as="convertValueToString"><![CDATA[ |
| function(cell) |
| { |
| return cell.getAttribute('label'); |
| } |
| ]]></add> |
| <mxStylesheet as="stylesheet"> |
| <add as="text"> |
| <add as="shape" value="rectangle"/> |
| <add as="perimeter" value="rectanglePerimeter"/> |
| <add as="fontSize" value="12"/> |
| <add as="align" value="left"/> |
| <add as="verticalAlign" value="top"/> |
| <add as="shadow" value="0"/> |
| <add as="strokeColor" value="none"/> |
| <add as="fillColor" value="none"/> |
| <add as="gradientColor" value="none"/> |
| </add> |
| <add as="defaultVertex" extend="text"> |
| <add as="shape" value="rectangle"/> |
| <add as="fontSize" value="11"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="middle"/> |
| <add as="shadow" value="1"/> |
| <add as="strokeColor" value="#C3D9FF"/> |
| <add as="fillColor" value="#C3D9FF"/> |
| <add as="gradientColor" value="white"/> |
| </add> |
| <add as="group"> |
| <add as="shape" value="rectangle"/> |
| <add as="perimeter" value="rectanglePerimeter"/> |
| <add as="fontSize" value="10"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="middle"/> |
| <add as="strokeColor" value="gray"/> |
| <add as="dashed" value="1"/> |
| </add> |
| <add as="defaultEdge"> |
| <add as="shape" value="connector"/> |
| <add as="fontSize" value="10"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="middle"/> |
| <add as="rounded" value="1"/> |
| <add as="labelBackgroundColor" value="white"/> |
| <add as="strokeColor" value="#36393D"/> |
| <add as="strokeWidth" value="1"/> |
| <add as="edgeStyle" value="elbowEdgeStyle"/> |
| <add as="endArrow" value="classic"/> |
| </add> |
| <add as="verticalConnector"> |
| <add as="elbow" value="vertical"/> |
| </add> |
| <add as="straightConnector"> |
| <add as="shape" value="connector"/> |
| <add as="endArrow" value="classic"/> |
| <add as="edgeStyle">null</add> |
| </add> |
| <add as="arrowConnector"> |
| <add as="shape" value="arrow"/> |
| <add as="fillColor" value="#C3D9FF"/> |
| <add as="endSize" value="20"/> |
| <remove as="edgeStyle"/> |
| </add> |
| <add as="swimlane"> |
| <add as="shape" value="swimlane"/> |
| <add as="shadow" value="0"/> |
| <add as="startSize" value="23"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="top"/> |
| <add as="strokeColor" value="#EEEEEE"/> |
| <add as="fillColor" value="#D4D4D4"/> |
| </add> |
| <add as="rounded"> |
| <add as="rounded" value="1"/> |
| </add> |
| <add as="ellipse"> |
| <add as="shape" value="ellipse"/> |
| <add as="perimeter" value="ellipsePerimeter"/> |
| <add as="strokeColor" value="#CDEB8B"/> |
| <add as="fillColor" value="#CDEB8B"/> |
| </add> |
| <add as="doubleEllipse" extend="ellipse"> |
| <add as="shape" value="doubleEllipse"/> |
| </add> |
| <add as="rhombus"> |
| <add as="shape" value="rhombus"/> |
| <add as="perimeter" value="rhombusPerimeter"/> |
| <add as="strokeColor" value="#FFCF8A"/> |
| <add as="fillColor" value="#FFCF8A"/> |
| </add> |
| <add as="triangle" extend="rhombus"> |
| <add as="shape" value="triangle"/> |
| <add as="perimeter" value="trianglePerimeter"/> |
| <add as="align" value="left"/> |
| </add> |
| <add as="hexagon"> |
| <add as="shape" value="hexagon"/> |
| </add> |
| <add as="actor"> |
| <add as="shape" value="actor"/> |
| <add as="strokeColor" value="#FFC7C7"/> |
| <add as="fillColor" value="#FFC7C7"/> |
| </add> |
| <add as="cloud"> |
| <add as="shape" value="cloud"/> |
| <add as="perimeter" value="ellipsePerimeter"/> |
| <add as="strokeColor" value="#CDEB8B"/> |
| <add as="fillColor" value="#CDEB8B"/> |
| </add> |
| <add as="cylinder"> |
| <add as="shape" value="cylinder"/> |
| <add as="spacingTop" value="10"/> |
| <add as="strokeColor" value="#4096EE"/> |
| <add as="fillColor" value="#4096EE"/> |
| </add> |
| <add as="hline"> |
| <add as="shape" value="line"/> |
| <add as="strokeWidth" value="3"/> |
| <add as="perimeter" value="rectanglePerimeter"/> |
| <add as="fontColor" value="black"/> |
| <add as="fontSize" value="10"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="bottom"/> |
| <add as="strokeColor" value="#36393D"/> |
| </add> |
| <add as="image"> |
| <add as="shape" value="image"/> |
| <add as="perimeter" value="rectanglePerimeter"/> |
| <add as="fontSize" value="10"/> |
| <add as="align" value="center"/> |
| <add as="verticalAlign" value="middle"/> |
| <add as="image" value="images/draw/mxlogo.jpg"/> |
| </add> |
| </mxStylesheet> |
| <mxGraphModel as="model"> |
| <add as="valueForCellChanged"><![CDATA[ |
| function(cell, value) |
| { |
| var previous = null; |
| |
| if (value == null || isNaN(value.nodeType)) |
| { |
| previous = cell.value.getAttribute('label'); |
| |
| if (value == null) |
| { |
| cell.value.removeAttribute('label'); |
| } |
| else |
| { |
| cell.setAttribute('label', value); |
| } |
| } |
| else |
| { |
| previous = cell.value; |
| cell.value = value; |
| } |
| |
| return previous; |
| } |
| ]]></add> |
| <root> |
| <Diagram label="My Diagram" href="http://www.jgraph.com/" id="0"> |
| <mxCell/> |
| </Diagram> |
| <Layer label="Default Layer" id="1"> |
| <mxCell parent="0"/> |
| </Layer> |
| </root> |
| </mxGraphModel> |
| </mxGraph> |
| <mxDefaultToolbar as="toolbar"> |
| <add as="connect" mode="connect" icon="images/connect.gif"><![CDATA[ |
| function (editor) |
| { |
| if (editor.defaultEdge != null) |
| { |
| editor.defaultEdge.style = null; |
| } |
| } |
| ]]></add> |
| <add as="connect" mode="connect" icon="images/straight.gif"><![CDATA[ |
| function (editor) |
| { |
| if (editor.defaultEdge != null) |
| { |
| editor.defaultEdge.style = 'straightConnector'; |
| } |
| } |
| ]]></add> |
| <add as="connect" mode="connect" icon="images/arrow.gif"><![CDATA[ |
| function (editor) |
| { |
| if (editor.defaultEdge != null) |
| { |
| editor.defaultEdge.style = 'arrowConnector'; |
| } |
| } |
| ]]></add> |
| <br/><br/> |
| <add as="Text" template="text" icon="images/text.gif"/> |
| <add as="Container" template="container" icon="images/swimlane.gif"/> |
| <add as="Rectangle" template="rectangle" icon="images/rectangle.gif"/> |
| <add as="Rounded" template="rounded" icon="images/rounded.gif"/> |
| <add as="Ellipse" template="shape" style="ellipse" icon="images/ellipse.gif"/> |
| <add as="Double Ellipse" template="shape" style="doubleEllipse" icon="images/doubleellipse.gif"/> |
| <add as="Rhombus" template="shape" style="rhombus" icon="images/rhombus.gif"/> |
| <add as="Triangle" template="actor" style="triangle" icon="images/triangle.gif"/> |
| <add as="Hexagon" template="cloud" style="hexagon" icon="images/hexagon.gif"/> |
| <add as="Actor" template="actor" style="actor" icon="images/actor.gif"/> |
| <add as="Cylinder" template="shape" style="cylinder" icon="images/cylinder.gif"/> |
| <add as="Cloud" template="cloud" style="cloud" icon="images/cloud.gif"/> |
| <add as="Line" template="hline" style="hline" icon="images/hline.gif"/> |
| <add as="Image" template="image" icon="images/image.gif"/> |
| </mxDefaultToolbar> |
| </mxEditor> |
