Online diagrams

I was looking for an online replacement Visio for creating diagrams online for blogs.

I was delighted to find Draw.Io. It has a lot of great features for integration with other products

  • When you connect with your Google account, then diagrams are automatically saved to your Google drive.
  • There is a Google App plugin that makes the diagram in Google drive open into draw.io
    OpenDiagramFromGoogleDrive
  • When the diagram is re-opened in draw.io, then
    • “File – Share” lets you directly access the Google drive sharing functionality
    • “File – Export” lets you save the diagram as PDF, SVG, PNG, JPG, GIF and its own XML format. The XML is possible to import again and that is the format that is stored in your Google drive.
      In MS Word you can do: Import – Object – Adobe PDFXML – select the PDF file.
      Here is a png:
      Exported PNG
    • “File – Embed” lets you embed the diagram via a div and JavaScript. Unfortunately this blog does not seem to let me do that.
    • Connection points on a selected shape lets connection arrows snap to the shapes – see the top rectangle:

Draw.Io editor

    • There is a shape you can use for HTML: Mockup Text – Table. Double click – Html. You can put a lot of other html than a table. It will remove some formatting and style tags. Still – it gives you more control of you text than the other text boxes. You can add links and images.
      • Note: You can apply some styling for the whole shape in Format – Style.
      • A little online helper utility: RTF to HTML. (Tip: Copy code to WordPad, save as RTF then convert to Html – then the indenting and colors will be remained in the HTML).
    • A javascript lib mxGraph is downloadable, so it can be included in your own HTML5 app for displaying your draw.io XML files.

That is probably all I need.

Draw.io – did you know?

Here is a list of 5 other alternatives

The End

Advertisements

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: