Interactive Diagrams with Draw.io

[@jansiekierski2762]

Woah, this is amazing! Thanks Colin!

[@colinjcodesalot]

Glad you liked it! 😁👍

[@bdanuw]

Love this !! Thanks

[@colinjcodesalot]

😁👍

[@shibumigo]

That's a great tip, thank you Colin!

[@colinjcodesalot]

I’m glad you enjoyed!

[@aswathyrjn]

Can I use an interactive diagram for each item in the list? And also can I highlight the item which is selected based on the radio buttons selected?

[@colinjcodesalot]

Yes to both. You can show/hide anything using the target tags. One thing I’ve done is show a bolder version of the selected text when the user clicks on it and hide the normal version. Then when they click on a different text block, I hid the current bold text, showed the normal version again, and then showed the bold version of the new selected text. You can also have each item show its own interactive diagram, for example, if you’re creating a diagram that has sub-steps within each step. Each top-level step can show its own list of sub-steps, and those can be interactive as well.

[@tinkuk4350]

Can we download the steps as gif

[@colinjcodesalot]

I've never tried that, but it should be doable. This video by my friend Alexis shows how she makes animated gifs out of her draw.io diagrams: www.linkedin.com/posts/alexisbertholf_how-i-animate-my-network-diagrams-steal-activity-7237087336059035649-FbQV? I hope this helps.