Question

Yesterday I was having an issue with some google graphs on my site while running opera. I was getting the error “your browser does not support graphs”. Today Its absolutely fine and in fact seems to be running a bit quicker.

I’d like to have a backup in my javascript so that if its not supported Ill just display a table.

Is there any such way to do this or do i need to check against a list of incoming browsers and figure it out for myself?

Answer 1

From http://code.google.com/intl/en/apis/chart/interactive/docs/:

Charts are rendered using HTML5/SVG technology to provide
cross-browser compatibility (including VML for older IE versions) and
cross platform portability to iPhones, iPads and Android.

They are apparently using inline SVG. http://caniuse.com/#search=inline%20svg isn’t very useful here because that’s about HTML5 parser recognizing SVG content, Google is generating SVG content dynamically however. I think that the following code snippet tests for inline SVG support correctly:

var svgRoot = null;
if ("createElementNS" in document)
  svgRoot = document.createElementNS("http://www.w3.org/2000/svg", "svg");
if (svgRoot && "width" in svgRoot)
  alert("Inline SVG supported");

If a dynamically created SVG element has SVG-specific properties then everything should be fine. You will still have to assume that MSIE is generally supported (via VML). Or use How do you detect support for VML or SVG in a browser to detect VML support. And that will hopefully match the compatibility checks that Google is performing (minus glitches like the one you apparently observed).