Question

What would be the best method for creating graphs in HTML/JavaScript if the minimum browser support is IE9, Chrome 16, FF 13, Safari 5.1.& Opera 10 ? SVG or Canvas ?
Google Charts ?

Answer 1

Going by https://stackoverflow.com/a/1651167/138772 and http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/:

You should use Canvas for:

• Interactive image editing: cropping, resizing, filters (think red eye removal, sepia, colorize, etc.)
• Generating raster graphics: data visualizations, data plots, rendering fractals, function plots.
• Image analysis: read pixels to gather data for histograms, color usage, and anything else you can imagine.
• Rendering game graphics, such as sprites and backgrounds.

You should use SVG for:

• Resolution-independent Web application user interfaces.
• Highly interactive animated user interfaces.
• Data charts and plots.
• Vector image editing.

So basically, use SVG if you want to have nice vectored graphs and the ability to manipulate them via the DOM, but use Canvas if you just want them drawn and don’t need the vectoring (you could probably set it up so it would scale to the page/window size, anyway) or DOM usage. Personally I’d recommend SVG, though, as I like vector graphics.