projects / dygraphs.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: 79aabc9)
Add CSS "reset" to fix Issue 429
authorDan Vanderkam <danvdk@gmail.com>
Fri, 8 Feb 2013 21:18:36 +0000 (16:18 -0500)
committerDan Vanderkam <danvdk@gmail.com>
Fri, 8 Feb 2013 21:18:36 +0000 (16:18 -0500)
dygraph.js patch | blob | blame | history
tests/css-positioning.html patch | blob | blame | history

diff --git a/dygraph.js b/dygraph.js
index 941badb..eba57db 100644 (file)
--- a/dygraph.js
+++ b/dygraph.js
@@ -930,6 +930,8 @@ Dygraph.prototype.createInterface_ = function() {
   this.graphDiv = document.createElement("div");
   this.graphDiv.style.width = this.width_ + "px";
   this.graphDiv.style.height = this.height_ + "px";
   this.graphDiv = document.createElement("div");
   this.graphDiv.style.width = this.width_ + "px";
   this.graphDiv.style.height = this.height_ + "px";
+  // TODO(danvk): any other styles that are useful to set here?
+  this.graphDiv.style.textAlign = 'left';  // This is a CSS "reset"
   enclosing.appendChild(this.graphDiv);
 
   // Create the canvas for interactive parts of the chart.
   enclosing.appendChild(this.graphDiv);
 
   // Create the canvas for interactive parts of the chart.
diff --git a/tests/css-positioning.html b/tests/css-positioning.html
index 733c12f..829de2f 100644 (file)
--- a/tests/css-positioning.html
+++ b/tests/css-positioning.html
@@ -8,14 +8,14 @@
     <![endif]-->
     <script type="text/javascript" src="../dygraph-dev.js"></script>
     <style>
     <![endif]-->
     <script type="text/javascript" src="../dygraph-dev.js"></script>
     <style>
-      html, body {
-        /*
-        max-width: 800px;
-        height: 100%;
-        margin-right: auto;
-        */
+      /* Changing 'body' -> 'html, body' triggers a bug */
+      body {
         margin-left: 100px;
       }
         margin-left: 100px;
       }
+
+      .container {
+        text-align: center;
+      }
     </style>
   </head>
   <body>
     </style>
   </head>
   <body>
@@ -23,21 +23,39 @@
     <div id="demodiv"></div>
 
     <script type="text/javascript">
     <div id="demodiv"></div>
 
     <script type="text/javascript">
+      function Data() {
+        var zp = function(x) { if (x < 10) return "0"+x; else return x; };
+        var r = "date,parabola,line,another line,sine wave\n";
+        for (var i=1; i<=31; i++) {
+        r += "200610" + zp(i);
+        r += "," + 10*(i*(31-i));
+        r += "," + 10*(8*i);
+        r += "," + 10*(250 - 8*i);
+        r += "," + 10*(125 + 125 * Math.sin(0.3*i));
+        r += "\n";
+        }
+        return r;
+      }
+
       g = new Dygraph(
               document.getElementById("demodiv"),
       g = new Dygraph(
               document.getElementById("demodiv"),
-              function() {
-                var zp = function(x) { if (x < 10) return "0"+x; else return x; };
-                var r = "date,parabola,line,another line,sine wave\n";
-                for (var i=1; i<=31; i++) {
-                r += "200610" + zp(i);
-                r += "," + 10*(i*(31-i));
-                r += "," + 10*(8*i);
-                r += "," + 10*(250 - 8*i);
-                r += "," + 10*(125 + 125 * Math.sin(0.3*i));
-                r += "\n";
-                }
-                return r;
-              },
+              Data,
+              {
+                labelsKMB: true,
+                legend: 'always'
+              }
+          );
+    </script>
+
+    <br/>
+    <div class="container">
+      <div id="chart2"></div>
+    </div>
+
+    <script type="text/javascript">
+      g = new Dygraph(
+              document.getElementById("chart2"),
+              Data,
               {
                 labelsKMB: true,
                 legend: 'always'
               {
                 labelsKMB: true,
                 legend: 'always'
danvk/dygraphs fork supporting touch events