d3.js dealing with non-svg browsers [closed]

Question

how do d3.js developers deal with browsers not capable of rendering svg? I am very curious because Internet Explorer 9, 8, 7 etc have a formidable majority market share in large key parts of the world, yet there seems to be such an active d3.js community as if Internet Explorer doesn't exist.

The purpose of D3 is for flexible data driven charts, so complex topics are able to be visualized in an intuitive way. So targeting the trendiest tech scene and pretending that everyone else also upgraded from their default browser is sort of negligent.

I've seen the New York Times provide alternate jpg infographics if specific browsers are detected

I've also seen some things that are intended to render a D3 svg server side, and display a dynamically generated image.

but what are the accepted practices and options? I feel like this should be at the top of the D3 homepage

how do you deal with it?

Answer 1

Generally you can use a robust polyfill, like Raphael, to make this work but you have to roll up your sleeves a bit. There are a few projects started along these lines to make it more seamless, but none are 100% ready to use out of the box as I understand it.

Some examples:

• R2D3
• Combining D3 and Raphael to make a network graph
• D34Raphael

Answer 2

D3 made some forward-looking choices in the way they wrote the Javascript code. It heavily relies on more recent ECMAScript methods, such as Array.forEach(), for its Javascript processing, and does not compensate for older IE's lack of RGBA or Hex support (among other features). I don't want to say it's "easy" or "simple," but on the surface it seems like it is possible to add in older-IE support to D3.js - POSSIBLY without too much hassle.