How to Create Sequence Diagrams with Draw.io in TiddlyWiki

When creating a sequence diagram for your TiddlyWiki project, it's essential to understand how different actions are dependent on each other. In this article, we will explore how to use Draw.io, an online diagram editor, to create sequence diagrams and integrate them into our TiddlyWiki.

Understanding Action Dependencies

In our habit tracker app, the Update the habit history action is dependent on other actions such as Add a habit, Delete a habit, Mark a habit as done, or Add a comment. For instance, when you add a comment in the habit tracker app, you must update the habit history. To show specific relationships between these actions, we can use an include relationship.

Using Include Relationship

To create a sequence diagram with Draw.io, you can use the include and extend features to show relationships between actions or classes and methods. This allows you to visualize how different actions interact with each other, making it easier to program and maintain your TiddlyWiki project.

Inserting Tiddlers into Diagrams

Draw.io also enables you to insert or transclude tiddlers into a diagram. For example, you can list a set of tiddlers and have them represented using process icons in a serial list with arrows. Additionally, you can include links to tiddlers or content within the diagram.

Integrating Draw.io with TiddlyWiki

To integrate Draw.io with your TiddlyWiki project, simply store the diagrams as SVG files. This allows you to easily import and export various types of chart files in the editor. You can also modify the theme of the editor to switch between day and night modes.

Exporting Diagrams

When creating a diagram with Draw.io, you can export it to various formats such as SVG, PNG, or other file formats supported by TiddlyWiki. The icon is saved in the form of SVG+embedded XML in TiddlyWiki, ensuring that the editability of the chart remains intact.

Viewing Diagrams

You can view your diagrams offline without requiring networking, just like any other image. However, please note that the editing mode requires internet connectivity due to Draw.io's online nature.

In conclusion, using Draw.io with TiddlyWiki is an excellent way to create sequence diagrams and integrate them into your project. With its powerful features such as include relationships, transcluding tiddlers, and exporting to various formats, you can easily visualize and maintain complex interactions between actions in your project. Try it out today!

Sequence diagram with draw io