Using SVG + Java for flexible information display, is this viable?

Question

Hi,

I have a requirement to create a "mimic" display of a complex electrical system. I have access to real-time status information and system block diagrams in Visio.

Is this a viable approach:

1. Create an SVG drawing from the system block diagram

2. Tag the SVG elements of interest with SVG attributes

3. load the SVG DOM into java

4. locate the tagged elements and modify them according to system status info (make the element RED if its "in alarm", for example)

5. render the SVG to PNG for display using BATIK (use a the swing component: JSVGCanvas)

A key requirement is flex ability to modify the SVG after the app is deployed. The app capable of flexibly pulling in different "datapoints" based on the tags in the SVG.

Anyone have success using a similar strategy? What pitfalls should I expect? What is out there in the way of SVG editing tools?

Answer 1

I've done something similar for a state of health display. I actually annotated the data objects and had them push their state into a dumb SVG file but the machinery should be roughly the same just reversed.

Benefits:

• Makes complex, dynamic diagrams insanely easy to render.
• Diagram maintenance is a breeze compared to everything else I've ever used.
• Ability to target a web app either directly via SVG or an indirectly via server-rendered images delivered to the client.

Pitfalls:

• Data binding can be painful depending on how complex you want your visualization to be. If you want to annotate the SVG to pull data into itself, this will probably end up being the hard part.
• You'll need a good grasp of XPath to do anything even slightly tricky. It's never hard but is often tedious to debug XPath expressions.

Editors: Inkscape. There's a few other vector graphics editors out there that can do SVG, either directly or as an export target, but none of the ones I've seen come close to Inkscape. It doesn't support every feature in the current SVG spec but it sounds like it'll be enough for most if not all of what you want. It's also pretty good about not blasting hand-edits to SVG files for when you need to something it doesn't support.

Answer 2

You should have also a look at SVG Salamander, I have not used it myself but some of the features are:

• "An index of all named shapes in the SVG graph is easily accessible. "
• "Direct access to the scene graph tree. You can use Java commands to manipulate it directly."