Visio Discussions > ShapeSheet & Smart Shapes

seeking a clever way for a user viewing a diagram in a browser to make a choice

(1/3) > >>

scott:
I’ve created a diagram that uses a color-by-value data graphic to assign colors to shapes based on a set of TRUE/FALSE values in each shape.

* Each TRUE/FALSE value indicates whether a particular equipment type is associated with that shape.
* Any given shape can have one TRUE value, multiple TRUE values, or no TRUE values.For example, the Shape Data values on the left in the graphic below will produce the orange/Multiple color from the palette on the right:


My goal is to allow the diagram to be viewed in a browser or the iOS app. That part is easy.

However, I also want the user to be able to take an action in the browser that results in highlighting only those shapes that have a specific TRUE setting. For example, the user may want to highlight all shapes that have Type B selected -- both those for which that’s the only selection and those for which B is one of several selections. After making that choice, all shapes for which Type B=TRUE, including ones that also have other TRUE values, should display the Type B color. All shapes with Type B=FALSE should be gray.

The challenging bit is finding a way for the user to make a selection when they are simply viewing the diagram and are not in edit mode. The only technique I’ve come up with so far is to use hyperlinks, which is how this sample diagram was created.

Follow the link in the previous paragraph to view the diagram in a browser; either tap or Ctrl+click the buttons in the legend in the lower left to filter by Type. (To make it easy to see what's happening, the shape text on each shape displays which types are set to TRUE.)

The good news is that this works. The bad news is that it requires a duplicate page for each type. That isn’t terrible for two or three types, but will be cumbersome in diagrams with eight, ten, or more Types.

I'm hoping that the clever folks who hang around here might be able to come up with another way to accomplish allowing the user to make a selection -- one that doesn’t require a separate page for each type.

BTW, feel free to download the sample diagram and tinker with it. Or just let me know if you have suggestions for improving the ShapeSheet stuff I've done to make the hyperlinks and data graphics work.

Thanks,
Scott

Yacine:
That screams for JavaScript.
A good starting point would be Nikolay's SVG exporter.


Not so elegant, but feasible would be to stick with your solution, but generate the sub-pages automatically. easy.

scott:
Thanks. Javascript makes sense; I was trying to stick with an "out of the box" solution to keep things simple for my client but I don't think a bit of Javascript code would bother them much.

I agree about using code to produce the sub-pages automatically -- it's already in progress.

Yacine:

--- Quote from: scott on September 27, 2022, 08:24:53 AM ---I was trying to stick with an "out of the box" solution to keep things simple for my client ...

--- End quote ---
Yes, unfortunately M$ still considers the printout as primary output format for Visio.
All the cool interactive stuff that should be state of the art in 2022 is only available via tweaks and workarounds.

scott:
I wouldn't say the current situation is quite as bad as a "printout" -- but I know what you mean because the browser rendering doesn't support any real interactivity. Thanks for your suggestions.

Navigation

[0] Message Index

[#] Next page