@@ -86,8 +99,6 @@
(Mouse over to highlight individual values. Click and drag to zoom. Double-click to zoom back out. Change the number and hit enter to adjust the averaging period.)
-
Temperatures in New York vs. San Francisco
-
@@ -123,7 +137,7 @@
Plots time series without using an external server or Flash
Works in Internet Explorer (using excanvas)
Lightweight (69kb) and responsive
-
Displays values on mouseover (this makes it easily discoverable)
+
Displays values on mouseover, making interaction easily discoverable
Supports error bands around data series
Interactive zoom
Displays Annotations on the chart
@@ -358,17 +372,28 @@
Internet Explorer Compatibility
-
The dygraphs library relies heavily on HTML's <canvas> tag, which Microsoft Internet Explorer does not support. Fortunately, some clever engineers created the excanvas library, which implements the <canvas> tag in IE using VML.
+
The dygraphs library relies heavily on the HTML5 <canvas> tag, which Microsoft Internet Explorer did not traditionally support. To use Microsoft's native canvas implementation in IE9, you need to set an HTML5 doctype on your page:
+
+
+<!DOCTYPE html>
+
-
You can add IE support to any page using dygraphs by including the following in your page:
+
When IE9 is in HTML5 mode, dygraphs works just like in other modern browsers.
+
+
If you want to support previous versions of Internet Explorer (IE6–IE8), you'll need to include the excanvas library, which emulates the <canvas> tag using VML. You can add excanvas by including the following snippet:
-<head>
- <!--[if IE]><script src="excanvas.js"></script><![endif]-->
-</head>
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
+ <!--[if IE]><script src="path/to/excanvas.js"></script><![endif]-->
+ </head>
-
This works quite well in practice. Charts are responsive, even under VML emulation.
+
(This is surprisingly tricky because the HTML5 doctype breaks excanvas in IE8. See this discussion for details.)
+
+
While VML emulation sounds like it would be slow, it works well in practice for most charts.
One common gotcha to look out for: make sure you don't have any trailing commas in parameter lists, e.g.
@@ -580,9 +605,5 @@ perl -ne 'BEGIN{print "Month,Nominal,Real\n"} chomp; ($m,$cpi,$low,$close,$high)
Created May 9, 2008 by Dan Vanderkam