Plane.so, a project management platform, has developed a draw.io integration where you can add, edit and store draw.io diagrams in Plane.so pages. Plane is a useful platform for technical documentation and project management for distributed teams. Both the simple draw.io Board editor and the full draw.io diagram editor are available, with all the standard built-in draw.io shape libraries and templates, as well as the generated smart templates and Mermaid diagram support.

Plane.so is a collaborative workspace for teams that can be deployed in the cloud, self-hosted in your own infrastructure or air-gapped for regulated industries. The project management platform has a range of features for IT, software development, marketing and sales - any team that needs projects, knowledge and agents in one space.

Install draw.io in your Plane workspace

1. Click on the configuration icon to open your Plane Settings.
2. Select the Workspace tab.
3. Select Integrations from the left hand menu.
4. Click on Configure under the draw.io integration and follow the prompts to set it up.
   

To uninstall the draw.io integration from your Plane workspace, click on the three vertical dots next to the green Installed flag and select Uninstall.

Add a diagram to a Plane page

• Type /draw and select the Draw.io diagram to add a diagram macro to the page. If you want a simpler whiteboard editor, select the Draw.io board macro.
  
• Click on the macro to open the draw.io editor.
  
• When you have finished diagramming, click on Save to return to the Plane page.
  

Your diagram will now be displayed inline. To edit it again, simply click on it.

Important: Diagram changes are not included in the page version history - your document will always display the most recent version of the embedded diagram.

Diagram in dark or light mode

You can use the draw.io editor in dark or light mode and the colours of shapes and text will adapt.

draw.io uses adaptive colours by default, so that team members who prefer to work in dark mode will still be able to read the diagrams added to a page in light mode.

Add diagrams to Plane work items

While the work item description can only contain text, you can add a draw.io diagram two ways.

1. Attach a .drawio file to the work item.
2. Link to a Plane page containing a draw.io diagram.
   

Do more with diagrams in Plane

As you have probably experienced, diagrams can take some time to draw. Where diagrams are a big part of your project documentation and need to be scheduled to certain team members, add a label to the work items that are diagrams.

Then, add a view that filters for that tag, and displays the work items in a timeline for a handy Gantt chart to plan and track your team’s diagram development schedule.

Embedded editor limitations

As the draw.io editor is embedded in a Plane page macro, there are a few limitations. There is currently no support for:

• customise the draw.io editor configuration
• custom shape libraries and custom templates
• displaying multi-page diagrams - the page will display the last diagram page tab you had open in the draw.io editor.

For custom templates, store your template diagrams in GitHub or on a cloud platform or shared drive within your network and import this file into a new diagram on a Plane page - in the draw.io editor, click File > Import from > URL.

Important note: This is a third-party integration

To use expanded or updated features that you have been used to in the draw.io editor also in the Plane.so integration, please contact Plane.so support and raise a request with them. We have not developed this integration so can not help you with any problems with it.

Follow us on GitHub, Twitter, Facebook.