A program is a process, not a thing. This also applies to life, the universe, and everything.


Declarative animation with SVG

One of the things which has been taking up my time from releasing Drawing Board is that I've been writing another guest edition of my friend David Mertz's XML Matters column for IBM developerWorks. The latest, SVG and the Scriptless Script went live yesterday.

My last article, on using the DOM, was something I know well and have used for years. This one was on a subject I've wanted to learn more about, so getting the examples all working the way I wanted was challenging, but I'm really happy with the result.

<teaser>Another reason I haven't released Drawing Board yet is that I want to put up a screencast of it in use, but there doesn't appear to be a good solution for creating screencasts on OS X. I think I've got a solution for that.</teaser>
Check Snapz Pro X for making screencasts. Not free, but it works well.

The alternative, I guess, is to do a full-screen recording via VNC (e.g. vnc2swf) and then editing it down afterwards. Snapz was cheaper than all the work involved in that :)
I tried viewing the SVGs in the story, but none of the animations worked. I'm using Firefox 1.5. The first image showed the three circles, but not the horizontal lines.

Anyhow, are there any good data-visualization tools for SVG? For example, it would be nice to use SVG to render a table of time-series data into a line plot.

Those are the two methods I found via Google. I'm opting for a third: Write a dedicated screencast program using PyObjC. I've almost got enough of it done to see if it's actually feasible %-)

Firefox doesn't yet support the SMIL animation features of SVG, I think I mentioned that in the article. You will probably still need the Adobe SVG plugin for the examples in this article.

I don't know of any general-purpose data-visualization tools for SVG, and most of the tools I do know of are either general vector art tools (Adobe Illustrator, for example), or specific to cartography (SVG is used a lot in cartography). There may be something out there I don't know about that would be revealed with some judicious googling.

On the other hand, simple SVG is pretty easy, and depending on your needs, could be scripted, either in Javascript from within the SVG or by using a scripting language like Python to convert your table into SVG. I don't know your exact requirements, but from the little you've told me, I'd think a Python script to do that would be pretty easy.

I hope that helps.
I had upgraded to Firefox 1.5 but then discovered it doesn't support SMIL stuff.

As for the data-visualization stuff, I think I'll just play around (once I get a viewer) and see how hard it would be to write.

Thanks for the tips.
Post a Comment

<< Home

This page is powered by Blogger. Isn't yours?