Most of the visualizations created with D3 use the SVG element. SVG graphics are resolution independent, which means that they can be scaled without pixelation, and they are relatively easy to create with D3. The SVG elements are also part of the DOM tree and allow us to select and manipulate individual elements of the figures and to change their attributes, triggering an automatic update by the browser.
There are a significant number of users who don't use a browser with SVG support, and sometimes, we can't just forget them. In this chapter, we will examine alternatives that provide visualizations without using SVG. We will create a visualization using only the div elements, discuss libraries that provide SVG support for older browsers, and show an example of integrating D3 and the canvas element.
The global browser market has a good support for SVG, both in mobile and desktop browsers. There is, however, a significant portion of users who don't enjoy SVG support; the most notable examples are the users of Internet Explorer 8.0 and older as well as users of the stock browser of Android under 3.0.
According to http://caniuse.com/, about 86 percent of the global browser market has basic SVG support (as of May 2014). Most of the applications can't afford to leave 14 percent of their users behind. With these users in mind, we will learn how to create data visualizations without using SVG and how to add SVG support to the browser using polyfilling. You can check a more up-to-date version of this and other tables on Can I use... (http://caniuse.com/#feat=svg).