Which would you prefer? SVG, HTML5 or regen'd-PNG for graphs and charts?

Question

I am developing a new site that displays some operational indicators. Thus, about a dozen charts / graphs will be displayed on the site. I want to be able to dynamically scale them (within reason) depending on the size of the browser.

I discuss the pros and cons of creating these as one of the following options:

• SVG . Great for scaling, but may have limited support,
• The HTML5 . Obviously a great choice for the future and for FF, IE clients?
• PNG . This requires me to update the PNG based on the size of DIV & c.

Which is your preferred option? I tend to PNG only for ubiquitous support, but would like to have client-side scaling. What is the best solution given the state of the art with SVG and HTML5 support in browsers?

Answer 1

You can do worse than explore the new graphics library: http://g.raphaeljs.com/

At first you won’t believe it.

Answer 2

SVG HTML5 PNG . PNG Firefox. (Canvas API, - .) SVG Firefox.

I , .

(Canvas , .)

Answer 3

SVG

Answer 4

SVG . Canvas . Internet Explorer . Raphaël (raphaeljs.com) API SVG IE, Canvas IE ExCanvas

, "Canvas SVG", , .

Answer 5

SVG HTML5, PNG, .

Answer 6

ExplorerCanvas <canvas> IE. , 1 2. , (), <canvas>, () .

Answer 7

You can use SVG with fallback png using CSS as described in this answer: fooobar.com/questions/17780 / ...