Does anyone know a reliable method for detecting SVG support in a browser, using Javascript?
I only found one solution, and it was apparently outdated (didn’t even have IE8 support yet) and seemed as large as the jQuery library…
While we’re at it, does anyone know how to check for canvas support as well? I’m fairly certain that it’s much simpler, but while we’re on the topic I might as well ask.
Basically a simple graphing library that natively supports canvas and SVG (without any kind of shiv) in order to be able to target pretty much every modern browser and mobile device. I’ve hunted all around and haven’t found anything that fits my needs. It usually uses one or the other.
If you know something that would speed up my process, that’d be great. =)
I’ll check out Modernizr in the mean time. Thanks.
Thanks. I’ll take a look at those. Raphael is just a JS graphics library, right? (i.e., would it be overkill if I had jQuery loaded also, which is a common requirement).
I think I looked at jqPlot before and it didn’t work well on mobile… but I don’t remember looking at that site, so I may be thinking of something else. Neither of them “officially” support mobile either, but hopefully they’ll work anyways.
Also, I would like to use SVG when it’s available, since I (think) for my purposes it would perform better than canvas (though not 100% sure on this one, need to do more testing).
And if it was self-programming that would be even better. XD (Yes, I have a lot of requirements… geez).
It calls itself a graphics library, but specifically it deals with vector graphics for canvas.
It’s only overkill to load in a library if you really don’t need to
I know that’s a bit of a vague answer of course. If you’re using a fair bit of jQuery then it’s worth keeping… if the only thing you’re doing is setting 2 click handlers, then it would be overkill.
Regarding performance, creating a graph is probably not so taxing on any one device that you would necessarily notice any performance gains between SVG over Canvas (unless you’re live-updating and animating a pretty full on graph).
I’ve seen that plugin on Filament Group before I think. It looks like a good idea to do it that way, since you’d always at least have an accessible fallback
For the library question, of course. =) I basically meant “Raphael doesn’t do the same type of stuff as jQuery, right?”, which is sounds like it doesn’t. =p
The only problem with the Visualize one is it doesn’t work on mobile (it’s SVG-based).
The problem is that I won’t have just one graph, but probably several (at least a half dozen) as well as an element which uses a pretty hefty canvas element (it’s hefty enough that I’m going to probably have to implement proper culling =p). Of course, this could (should, and probably will) involve looking at the workflow again (especially for mobile devices). This is a rather hefty project that we’re beginning, so I want to keep the basic as trim as possible to give us as much wiggle room as we may need later on.
It looks like if I went the canvas-only route, with a shim for for IE <= 8, I should cover just about everything. The only thing I’m not sure about is Android 2.0 (which doesn’t support canvas) and other devices (couldn’t find stats for Blackberry and WebOS).
… I think now I’ve officially stepped into way-too-OCD-territory. =p