Prevent crashing when using unsupported css3 properties for your browser in labelsDiv...
authorJosep Llodrà <jlg.hrtc@gmail.com>
Fri, 24 Feb 2012 12:01:11 +0000 (13:01 +0100)
committerJosep Llodrà <jlg.hrtc@gmail.com>
Fri, 24 Feb 2012 12:01:11 +0000 (13:01 +0100)
dygraph.js
tests/customLabelCss3.html [new file with mode: 0644]

index 0748d26..fed1cf4 100644 (file)
@@ -1002,9 +1002,11 @@ Dygraph.prototype.createStatusMessage_ = function() {
     var div = document.createElement("div");
     div.className = "dygraph-legend";
     for (var name in messagestyle) {
-      if (messagestyle.hasOwnProperty(name)) {
-        div.style[name] = messagestyle[name];
-      }
+               try {
+                       div.style[name] = messagestyle[name];
+               } catch (e) {
+                       console.warn("You are using unsupported css properties for your browser in labelsDivStyles");
+               }
     }
     this.graphDiv.appendChild(div);
     this.attrs_.labelsDiv = div;
diff --git a/tests/customLabelCss3.html b/tests/customLabelCss3.html
new file mode 100644 (file)
index 0000000..c90af5f
--- /dev/null
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
+    <title>Label styles</title>
+    <!--[if IE]>
+    <script type="text/javascript" src="../excanvas.js"></script>
+    <![endif]-->
+    <!--
+    For production (minified) code, use:
+    <script type="text/javascript" src="dygraph-combined.js"></script>
+    -->
+    <script type="text/javascript" src="../dygraph-dev.js"></script>
+
+    <script type="text/javascript" src="data.js"></script>
+  </head>
+  <body>
+    <p>Labels are styled with css3:</p>
+    <div id="div_g14" style="width:600px; height:300px;"></div>
+
+    <script type="text/javascript">
+      g14 = new Dygraph(
+            document.getElementById("div_g14"),
+            NoisyData, {
+              rollPeriod: 14,
+              errorBars: true,
+              labelsDivWidth: 100,
+              labelsDivStyles: {
+                'backgroundColor': 'rgba(200, 200, 255, 0.75)',
+                               'padding': '4px',
+               'border': '1px solid black',
+                               'borderRadius': '10px',
+                               'boxShadow': '4px 4px 4px #888'
+                         },
+              labelsSeparateLines: true,
+              yAxisLabelWidth: 20
+            }
+          );
+    </script>
+  </body>
+</html>