To Flash or SVG?

I am in the process of completely rewriting a graphing tool that was created quickly and dirtily as needed whilst I was writing up my thesis. The basic requirements were that it should plot x-y, quantile-quantile and density graphs and histograms. So far nothing unusual, but I wanted to allow any points or lines to be hyperlinked to external webpages. Nick Day used the graphing toolkit when analysing some NMR results as reported by pmr on his blog.

Anyway, hopefully you like the results. So now onto the main question. Now that I am rewriting the code I find myself wondering whether I should continue down the SVG line or move to Flash?

I really like SVG – one of the first things that I had to do when I started my PhD was to create some animations. (I will upload these at some point). It took a couple of hours to get the basics of drawing static images and even fewer to get the basics of animations. There are masses of primers, tutorials and examples out there and all it took to create the animations was a text editor, a notepad to draw out the storyboard and a little imagination. If I was going to do the same thing now it would be so much easier. For a start I would draw out all the basic elements using Inkscape (I never got to grips with SodiPodi) and then animate them. No doubt the results would look a great deal better (I think I should do this and upload these too).

There are drawbacks of course. I am the first to admit that I had (still have) problems with curves. The biggest problem is support. Is there any point spending time trying to create useful, good looking SVG if no one can use it?

So onto Flash. It looks good, it can be animated, it is certainly supported but I can’t find any help out there as to how I can create it by hand – or even if it is possible (though I am assured it is). Maybe this is simply because there are so many sites out there dedicated to authoring flash (over 1 million searching for hand authoring flash), trying to sift these for what I actually want is difficult.

I am trying to make sure that I am keeping the data and the rendering separate so for a while I don’t need to make a choice – but I don’t want to waste my time writing something that will not be used. How should I go forwards? Beyond graphing there is a desire to show automatically created animations of chemical reactions and for that the sooner a decision is made the better.


3 Responses to To Flash or SVG?

  1. Andrew says:

    Hi Joe, good to see you blogging again!

    I mostly know about authoring Flash in the context of sIFR (wikipedia) and web applications; for the second of those you’d just use MXML with Flex, which Adobe provide an SDK for. might have something useful.

  2. Toby says:

    For what it’s worth, I’m slowly coming to the conclusion that SVG is something of a dead-end.

    Browser support hasn’t become widespread quickly enough, and for the sort of use-cases I have (multiple graphs within a single document), SVG forces generation of the graphs at document-creation time, which slows down document creation dramatically.

    (This is actually becoming a real problem – for some DL_POLY outputs we need to produce hundreds of graphs, each with thousands of points, and appealing though a pure-XSLT SVG production solution has been, it results in run-times in tens of minutes per document. This matters less for your Java library I’d guess, though.)

    But I think the solution is not flash, but JS/.

    I’ve been playing around with flot, and I’m happy with the results so far. The data can be kept in the document as a set of javascript arrays, and then rendered on demand by flot.

    This means

    a) much faster document generation (for me anyway)

    b) potentially, much smaller documents. (although not so much in my case – I need standalone documents, so the full source of jQuery+flot is being included every time. This is not actually that bad given the size of the documents anyway)

    c) *vastly* nicer looking graphs. Seriously – I’m not a graphic designer, there’s no point me trying to spend time making my SVG graphs look that nice if I can borrow someone else’s expertise.

    d) easily programmable interactivity. I think potentially you could do some of the same tricks with sufficiently advanced SVG, but why bother when it’s trivial in JS.

    e) Proper cross-platform browser support. Works natively everywhere, including IE, without requiring plugins.

    So I’ve now got flot included in ccViz, and working partially as a back-end to Pélote. You’re welcome to borrow/extend any of it if you like.

    In terms of animation, there aren’t any off-the-shelf toolkits to help you in the same way that there are from flash, but if you can do the rendering of each image relatively easily, then plugging it into something like this ought to be fairly do-able.

  3. Toby says:

    oops. WordPress doesn’t like my tags. Above should say:

    But I think the solution is not flash, but JS/<canvas>.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: