IE compatibility notes
authorDan Vanderkam <danvk@google.com>
Tue, 8 Dec 2009 20:31:49 +0000 (12:31 -0800)
committerDan Vanderkam <danvk@google.com>
Tue, 8 Dec 2009 20:31:49 +0000 (12:31 -0800)
docs/index.html

index e75c9a4..b5dc38a 100644 (file)
@@ -56,6 +56,7 @@
   <ul>
   <li><a href="#demo">Demo</a>
   <li><a href="#usage">Usage</a>
+  <li><a href="#ie">IE Compatibility</a>
   <li><a href="#stock">Stock chart</a>
   <li><a href="#options">Options Reference</a>
   <li><a href="#policy">Data Policy</a>
@@ -353,6 +354,34 @@ new Dygraph(
   <li>The error bars are partially transparent. This can be seen when they overlap one another.</li>
 </ul>
 
+<a name="ie"><h2>Internet Explorer Compatibility</h2>
+
+<p>The dygraphs library relies heavily on HTML's &lt;canvas&gt; tag, which
+Microsoft Internet Explorer does not support. Fortunately, some clever engineers
+created the <a href="http://code.google.com/p/explorercanvas/">excanvas</a>
+library, which imlements the &lt;canvas&gt; tag in IE using VML.</p>
+
+<p>You can add IE support to any page using dygraphs by including the following
+in your page:</p>
+
+<pre>
+&lt;head&gt;
+&lt;!--[if IE]&gt;&lt;script src="excanvas.js"&gt;&lt;/script&gt;&lt;![endif]--&gt;
+&lt;/head&gt;
+</pre>
+
+<p>This works quite well in practice. Charts are responsive, even under VML
+emulation.</p>
+
+<p>One common gotcha to look out for: make sure you don't have any trailing
+commas in parameter lists, e.g.</p>
+
+<pre>new Dygraph(el, data, {
+  showRoller:true,  // &lt;-- note trailing comma
+})</pre>
+
+<p>Most browsers will ignore the trailing comma, but it will break under IE.</p>
+
 <a name="stock"><h2>One last demo</h2>
 
 <p>This chart shows monthly closes of the Dow Jones Industrial Average, both in nominal and real (i.e. adjusted for inflation) dollars. The shaded areas show its monthly high and low. CPI values with a base from 1982-84 are used to adjust for inflation.</p>