I want to draw a free-hand polygon, to enclose certain portions of my diagram so I can identify them as being part of Phase I development, for example. Is there a polygon tool in draw.io?
-
1Not currently, you can vote on the idea here draw.uservoice.com/forums/266072-feature-requests/suggestions/…– Thomas the Tank EngineCommented Mar 13, 2015 at 17:52
-
Unfortunately that link for voting doesn't work. It says "This site is restricted."– JoooeeyCommented May 13, 2019 at 18:28
5 Answers
Start by adding the polygon shape to your drawing. The polygon shape is within the "Basic" shapes group. You may need to bring the "Basic" shapes group into view from the "View" > "Shapes..." menu.
Next, select your polygon and click "Edit Style". There you will see something like:
shape=mxgraph.basic.polygon;polyCoords=[[0.25,0],[0.75,0],[1,0.25],[1,0.75],[0.75,1],[0.25,1],[0,0.75],[0,0.25]];
Add/Remove additional points to the polyCoords array and click on Apply. No need to worry about getting the coordinates correct -- we'll move them around in the next step. Just keep them within the boundary of your shape (from 0.0 to 1.0). Click Apply.
Finally, move your points around on the drawing canvas.
-
2
-
-
1Just to be a little more helpful, here are the coords I use: polyCoords=[[0.50,0],[0.81,0.095],[1,0.35],[1,0.66],[0.81,0.91],[0.50,1],[0.25,0.94],[0,0.66],[0,0.35],[0.19,0.095]]– flagsCommented Jul 15, 2022 at 11:58
I just found the polyline and polygon shapes, which are kindof what you were searching for... however they're limited to 8 waypoints, you can move every waypoint separately and they can be filled.
Both are located in the Basic
shapes section.
-
It seems that those options were removed. Using v 12.4.2 here, they are nowhere to be found.– alelomCommented Dec 15, 2020 at 16:41
-
-
2Both polyline and polygon shapes have 8 waypoints by default, However, you can add (or remove) waypoints on the polyline or polygon shapes by editing its style. Select the shape, then choose 'Edit Style'. You'll see 8 default waypoint coordinates in the
polyCoords
array -- simply add or remove waypoints to this array as needed and apply. Then, drag any added waypoints on the edge of the shape as desired.– bug11Commented Jan 24, 2021 at 20:55
I do it via the line tool. You can switch the endings to none and the waypoints to orthogonal so you get a "free hand" tool. If you place the first and last waypoint on each other you can draw any polygon you want.
-
14
Unfortunately, at present time (and since a long time) there is no easy solution. If you really need to draw a filled polygon, the only solution that I could find is to represent it as a "patchwork" of simple shape (triangles, rectangles, etc.). More precisely, for each of the shapes which will compose te patchwork, you can:
- define the correct size, and the correct rotation by adjusting the parameter [Angle] of the onglet [Arrange]; this is the most time-consuming step,
- remove the border, fill the shape with the color you want, and send it to the back,
If you take time, you can reasonably cover simple polygons by using this technique.
Try using these coordinates. verticalLabelPosition=bottom;verticalAlign=top;html=1;shape=mxgraph.basic.polygon;polyCoords=[[0.27,0.02],[0.67,0],[0.94,0.15],[1,0.43],[0.92,0.75],[0.59,0.9],[0.16,0.84],[0,0.57],[0,0.25]];polyline=0;fillColor=none;strokeColor=#FF3333;