Diagram in Lark with our open-source editor

diagrams.net 23 Feb 2022

Share:

We aim to make diagramming as accessible as possible. As draw.io is an open-source application, an increasing range of applications have integrated our diagramming editor or provide an add-in with our diagramming technology.

Lark is a suite of collaboration and communication tools for your workplace, including documentation, messaging, cloud storage, email and more. It has integrated a simplified draw.io editor directly into your content creation tools on the platform.

How to add a new diagram to a Lark page or wiki

Log into your Lark account and click on the menu next to your avatar - select Docs to see a list of recent pages that have been edited and the Wikis you have access to. Navigate to the page using the left panel, or create a new page

Hover over the page, and click on the +, then select the type of diagram you want to add. Lark provides the shape libraries and tools that you’ll need.

  • Flowchart
  • UML diagram

Add a new diagram to a page in Lark

The diagram editor will open in the same tab in your browser. Now you can add shapes and their labels, drag connectors between the shapes and style your diagram just as you would in the diagrams.net editor.

When you are finished, click Close to save your diagram.

Edit a diagram in Lark just as you would in diagrams.net

Work with diagrams on Lark pages

View the diagram: To open the diagram as a larger image in a distraction-free viewer, click on the diagram. Use the toolbar at the bottom of the viewer to zoom in and out, or rotate the diagram. The close the viewer, click on the X in the top right.

View a diagram in a Lark page in a distraction-free viewer

Use the diagram toolbar

When you hover over a diagram, a toolbar will appear above or below it.

  • Edit a diagram: Click Edit to open it in the diagram editor.
  • Discuss a diagram: Click on the speech bubble to add your comments to the diagram.
  • Download a diagram as an image: Click on the download symbol in the toolbar. You can also download an image of your diagram from within the diagram editor.

Edit an existing diagram or add comments in Lark via the toolbar that appears above or below the diagram when you hover over it

Use the action menu

Click on the action menu icon that appears next to the top left corner of a diagram on a page.

  • Cut the diagram: Select Cut from the action menu to delete the diagram but copy it to the clipboard first, so you can move it to another page.
  • Copy a diagram: Select Copy from the action menu. Press Ctrl+V (Cmd+V on macOS) to paste a copy of the diagram on the same page or another page.
  • Delete a diagram: Select Delete from the action menu. This does not copy the diagram first.

Use the action menu to move (cut), copy or delete a diagram on a Lark page

See more draw.io integrations

We love seeing our diagram editor being adapted and integrated into other applications - it’s why we’ve made it open source on Github. As JGraph, we develop some integrations ourselves - all of our apps and add-ons are branded as draw.io for Atlassian Confluence and Jira, Microsoft Office applications and Teams, and Google Workplace and Classroom.

Learn more about the diagrams.net integrations - both those we develop, and those developed by third parties.

There is a large ecosystem of diagrams.net and draw.io apps for diagramming in whichever platform or app you are using for documentation

Follow us on GitHub, Twitter, Facebook, Discord.

Share: