SVG: The best way to graph quantitative data(developers.simplegeo.com)
developers.simplegeo.com
SVG: The best way to graph quantitative data
http://developers.simplegeo.com/blog/2011/01/05/svg-the-best-way-to-graph-quantitative-data/
10 comments
SVG is slower than html5 canvas. my preference would be still html5 due to performance reasons. It is good to use a combination of both. For SVG files can be converted to javascript code and vice versa
RaphaelJS offers the advantages of SVG with an IE fallback. It's a Javascript library that outputs VML in IE6+ and SVG everywhere else.
The graphs can be manipulated in JS after their creation to create animations.
http://raphaeljs.com/
The graphs can be manipulated in JS after their creation to create animations.
http://raphaeljs.com/
Also has the disadvantage of adding a lot of unnecessary overhead to SVG, changing how you interact with it, and preventing you from using lots of SVG features. For anything that needs much redrawing or interaction, the IE fallback can be extremely slow.
If you have reasonably simple needs or can adapt an existing Raphael demo, go for it. For my own projects, I don’t think it’s worth it, but YMMV.
Protovis is a much more exciting SVG framework.
If you have reasonably simple needs or can adapt an existing Raphael demo, go for it. For my own projects, I don’t think it’s worth it, but YMMV.
Protovis is a much more exciting SVG framework.
Naw, SVG is a good way some of the time. It's very context specific.
It's worth noting that Android browsers don't support SVG (yet).
To make that even more..fun the support is there but disabled and the dev team have refused to give any kind of timeline. I assume there's either some significant performance issues or glaring bugs. This seems odd given it's part of webkit & runs just dandy on iOS.
Hadn't heard of simplegeo: look cool...one of the only startups wthout a jobs page: p
If you are interested in SVG charting engines, check out Highcharts. Used them on a project recently and really liked how it turned out. It's a shame that VML performance in IE is so terrible when SVG performance in Chrome is so awesome.
http://www.highcharts.com/
http://www.highcharts.com/
Highcharts is definitely one of the most impressive chart solutions I have seen.
I don't remember its VML performance being particularly slow but I do know its' SVG performance screams in IE9.
I don't remember its VML performance being particularly slow but I do know its' SVG performance screams in IE9.
Ironically, Adobe used to be the biggest supporter of SVG... before they purchased Flash. Their svg renderer was by far the best in the field at the time, and supported lots of wonderful features, including great ECMAscript (Javascript), had the ability to build AJAX-like interactions using remote requests, and was fundamentally awesome.
It never made it out of beta and got killed when Flash became Adobe's new sweetheart. Very sad.
It never made it out of beta and got killed when Flash became Adobe's new sweetheart. Very sad.
I once made a GPS navigation system using IE 6 (!) in fullscreen, the Adobe flash plugin (for SVG and ECMAScript), SVG files on local disk and a small program that got the GPS coordinates from the receiver and added them to a file in the same directory. This was a few years ago before mobile internet became cheap enough for mainstream use.
Cool. But where's the live demo?
Also - just one snarky comment on JS style:
Also - just one snarky comment on JS style:
if(!!document.createElementNS
&& !!document.createElementNS('http://www.w3.org/2000/svg, "svg").createSVGRect) {
d3 is really interesting from a coding standpoint. It's a bit like a fancy orm like SQLAlchemy, Sequel, or the new ActiveRecord with arel. Instead of transforming model data it transforms view data, though. It's worth a look IMHO.
https://github.com/mbostock/d3
https://github.com/mbostock/d3