That is really cool. Thank you so much! I'm digging into a network install and this will be super valuable for me and the client. What a time to be alive, honestly.
The list is made of individual text blocks that have click actions set on each block. When a user clicks on a text block, it not only shows the components in the diagram that correspond to that block, it also replaces the empty circle next to the text block with a checked circle. The "View All" replaces all of the empty circles with checked circles. Those empty and checked circles follow the same tagging approach that's described in the video - that is, each checked circle is a graphic that's tagged with a generic tag, and a tag that ties it to a step. When the action on a text block is triggered, it hides all of the checked circles that have the generic tag (so, all of them) and shows the one that has the tag matching the action in the step. Clicking "View All" shows all of the checked circles that have the generic tag. I hope that helps. Please let me know if you have more questions.
@@colinjcodesalot Thanks , do you have more details / video as how the layer works as I cant get the same view as yours. May be something not correct on layer.
@@shramar You can access the layers tab by going to View > Layers in the top menu, or Cmd+Shift+L on a Mac (which I'm guessing means Ctl+Shift+L on a PC). From there you can show/hide, lock, and even move things around the different layers. I can put a video together about how that works. Great suggestion!
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.
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.
![Kumamoto Masters Japan 2024 | Gregoria Mariska Tunjung (INA) [5] vs. Akane Yamaguchi (JPN) [2] | F](http://i.ytimg.com/vi/EIjZybhsWqA/mqdefault.jpg)
That is really cool. Thank you so much!
I'm digging into a network install and this will be super valuable for me and the client.
What a time to be alive, honestly.
I'm glad you found it useful! :D
That's a great tip, thank you Colin!
I’m glad you enjoyed!
Woah, this is amazing! Thanks Colin!
Glad you liked it! 😁👍
Love this !! Thanks
😁👍
Hi Colin , How the list with check box is created ? Let me know if there is any other video.
The list is made of individual text blocks that have click actions set on each block. When a user clicks on a text block, it not only shows the components in the diagram that correspond to that block, it also replaces the empty circle next to the text block with a checked circle. The "View All" replaces all of the empty circles with checked circles.
Those empty and checked circles follow the same tagging approach that's described in the video - that is, each checked circle is a graphic that's tagged with a generic tag, and a tag that ties it to a step. When the action on a text block is triggered, it hides all of the checked circles that have the generic tag (so, all of them) and shows the one that has the tag matching the action in the step. Clicking "View All" shows all of the checked circles that have the generic tag.
I hope that helps. Please let me know if you have more questions.
@@colinjcodesalot Thanks , do you have more details / video as how the layer works as I cant get the same view as yours. May be something not correct on layer.
@@shramar You can access the layers tab by going to View > Layers in the top menu, or Cmd+Shift+L on a Mac (which I'm guessing means Ctl+Shift+L on a PC). From there you can show/hide, lock, and even move things around the different layers. I can put a video together about how that works. Great suggestion!
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?
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.
Can we download the steps as gif
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.
Where does one find that shirt?
I picked it up at Cisco Live in 2019
I just checked the online store and it looks like they don’t sell it there 😖