Use CSS for tests, gallery and docs dygraphs-css
authorDan Vanderkam <danvdk@gmail.com>
Wed, 28 Sep 2016 12:45:57 +0000 (08:45 -0400)
committerDan Vanderkam <danvdk@gmail.com>
Wed, 28 Sep 2016 12:45:57 +0000 (08:45 -0400)
98 files changed:
docs/annotations.html
gallery/border.js
gallery/edge-padding.js
gallery/index.html
gallery/range-selector.js
gallery/styled-chart-labels.js
gallery/temperature-sf-ny.js
tests/annotation-native.html
tests/annotation.html
tests/avoidMinZero.html
tests/border.html
tests/callback.html
tests/century-scale.html
tests/charting-combinations.html
tests/color-cycle.html
tests/color-visibility.html
tests/connect-separated.html
tests/crosshair.html
tests/css-positioning.html
tests/custom-bars.html
tests/custom-circles.html
tests/customLabel.html
tests/customLabelCss3.html
tests/dateWindow.html
tests/daylight-savings.html
tests/demo.html
tests/dense-fill.html
tests/draw-points.html
tests/drawing.html
tests/dygraph-many-points-benchmark.html
tests/dygraph.html
tests/dynamic-update.html
tests/exported-symbols.html
tests/fillGraph-alpha.html
tests/fillGraph.html
tests/fractions.html
tests/grid_dot.html
tests/gviz-infinity.html
tests/gviz-selection.html
tests/gviz.html
tests/hairlines.html
tests/highlighted-region.html
tests/hourly.html
tests/iframe.html
tests/independent-series.html
tests/interaction.html
tests/is-zoomed-ignore-programmatic-zoom.html
tests/is-zoomed.html
tests/isolated-points.html
tests/label-div.html
tests/labelsDateUTC.html
tests/labelsKMB.html
tests/layout-options.html
tests/legend-formatter.html
tests/legend-values.html
tests/linear-regression-addseries.html
tests/linear-regression-fractions.html
tests/linear-regression.html
tests/link-interaction.html
tests/logscale.html
tests/missing-data.html
tests/multi-scale.html
tests/native-format.html
tests/negative.html
tests/no-range.html
tests/no-visibility.html
tests/number-format.html
tests/numeric-axis.html
tests/numeric-gviz.html
tests/out-of-order.html
tests/per-series.html
tests/perf.html
tests/plotter.html
tests/plotters.html
tests/plugins.html
tests/range-selector.html
tests/resize.html
tests/reverse-y-axis.html
tests/series-highlight.html
tests/small-range-zero.html
tests/smooth-plots.html
tests/spacing.html
tests/stacked.html
tests/steps.html
tests/stock.html
tests/straw-broom.html
tests/styled-chart-labels.html
tests/synchronize.html
tests/temperature-sf-ny.html
tests/two-axes-vr.html
tests/two-axes.html
tests/unboxed-spark.html
tests/underlay-callback.html
tests/value-axis-formatters.html
tests/visibility.html
tests/x-axis-formatter.html
tests/zero-series.html
tests/zoom.html

index 0a3ba17..9ed49b1 100644 (file)
@@ -6,6 +6,9 @@
   .annotation {
     font-size: 12px !important;
   }
   .annotation {
     font-size: 12px !important;
   }
+  .dygraph-legend {
+    width: 300px;
+  }
 </style>
 
 <h2>dygraphs Annotations</h2>
 </style>
 
 <h2>dygraphs Annotations</h2>
@@ -26,7 +29,6 @@ them.</p>
       showRoller: true,
       customBars: true,
       labelsKMB: true,
       showRoller: true,
       customBars: true,
       labelsKMB: true,
-      labelsDivWidth: 300
     }
   );
 
     }
   );
 
index b5e4f68..eacaf46 100644 (file)
@@ -6,12 +6,12 @@ Gallery.register(
     title: 'Graph stays within the border',
     setup: function(parent) {
       parent.innerHTML =
     title: 'Graph stays within the border',
     setup: function(parent) {
       parent.innerHTML =
+          "<style>.dygraph-legend { border: 1px solid black; }</style>" +
           "<div id='bordered' style='border: 1px solid red; width:600px; height:300px;'></div>";
     },
     run: function() {
       new Dygraph(document.getElementById('bordered'), data,
       {
           "<div id='bordered' style='border: 1px solid red; width:600px; height:300px;'></div>";
     },
     run: function() {
       new Dygraph(document.getElementById('bordered'), data,
       {
-        labelsDivStyles: { border: '1px solid black' },
         title: 'Chart Title',
         xlabel: 'Date',
         ylabel: 'Temperature (F)'
         title: 'Chart Title',
         xlabel: 'Date',
         ylabel: 'Temperature (F)'
index be79054..5956d4a 100644 (file)
@@ -6,6 +6,7 @@ Gallery.register(
     title: 'Graph edge padding and axis position',
     setup: function(parent) {
       parent.innerHTML = (
     title: 'Graph edge padding and axis position',
     setup: function(parent) {
       parent.innerHTML = (
+          "<style>.dygraph-legend { width: 100px; }</style>" +
           "<p>" +
           "  <b>Mode:</b>" +
           "    <input type='radio' name='mode'>use {x,y}RangePad</input>" +
           "<p>" +
           "  <b>Mode:</b>" +
           "    <input type='radio' name='mode'>use {x,y}RangePad</input>" +
@@ -39,7 +40,6 @@ Gallery.register(
 
           var g = new Dygraph(gdiv, data, {
               labels: ['x', 'A', 'B'],
 
           var g = new Dygraph(gdiv, data, {
               labels: ['x', 'A', 'B'],
-              labelsDivWidth: 100,
               gridLineColor: '#ccc',
               includeZero: true,
               width: 250,
               gridLineColor: '#ccc',
               includeZero: true,
               width: 250,
index c953deb..a749cf0 100644 (file)
@@ -2,6 +2,7 @@
 <html>
   <head>
     <title>Dygraphs Gallery</title>
 <html>
   <head>
     <title>Dygraphs Gallery</title>
+    <link rel="stylesheet" href="../css/dygraph.css" />
 
     <script src="../dist/dygraph.js"></script>
     <script src="../src/extras/synchronizer.js"></script>
 
     <script src="../dist/dygraph.js"></script>
     <script src="../src/extras/synchronizer.js"></script>
index 09bfd49..e243b43 100644 (file)
@@ -7,6 +7,11 @@ Gallery.register(
     title: 'Demo of the Range Selector',
     setup: function(parent) {
       parent.innerHTML = [
     title: 'Demo of the Range Selector',
     setup: function(parent) {
       parent.innerHTML = [
+          "<style>",
+          "  #darkbg .dygraph-axis-label { color: white; }",
+          "  .dygraph-legend { text-align: right; }",
+          "  #darkbg .dygraph-legend { background-color: #101015; }",
+          "</style>",
           "<p>No roll period.</p>",
           "<div id='noroll' style='width:600px; height:300px;'></div>",
           "",
           "<p>No roll period.</p>",
           "<div id='noroll' style='width:600px; height:300px;'></div>",
           "",
@@ -27,7 +32,6 @@ Gallery.register(
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' },
             showRangeSelector: true
           }
       );
             showRangeSelector: true
           }
       );
@@ -41,7 +45,6 @@ Gallery.register(
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' },
             showRangeSelector: true,
             rangeSelectorHeight: 30,
             rangeSelectorPlotStrokeColor: 'yellow',
             showRangeSelector: true,
             rangeSelectorHeight: 30,
             rangeSelectorPlotStrokeColor: 'yellow',
@@ -58,11 +61,9 @@ Gallery.register(
               title: 'Nightly Temperatures in New York vs. San Francisco',
               ylabel: 'Temperature (F)',
               legend: 'always',
               title: 'Nightly Temperatures in New York vs. San Francisco',
               ylabel: 'Temperature (F)',
               legend: 'always',
-              labelsDivStyles: { 'textAlign': 'right', 'backgroundColor': '#101015' },
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
               rangeSelectorPlotFillGradientColor: 'rgba(123, 104, 238, 0)',
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
               rangeSelectorPlotFillGradientColor: 'rgba(123, 104, 238, 0)',
-              axisLabelColor: 'white',
               colorValue: 0.9,
               fillAlpha: 0.4
           }
               colorValue: 0.9,
               fillAlpha: 0.4
           }
index 0268f6d..6f8c3b4 100644 (file)
@@ -6,6 +6,7 @@ Gallery.register(
     title: 'Each chart label is styled independently with CSS',
     setup: function(parent) {
       parent.innerHTML = [
     title: 'Each chart label is styled independently with CSS',
     setup: function(parent) {
       parent.innerHTML = [
+          "<style>.dygraph-legend { text-align: right; background: none; }</style>",
           "<p class='infotext'>This chart's labels are styled</p>",
           "<div class='chart' id='div_g' style='width:600px; height:300px;'></div>",
           "<p class='infotext'>This version of the chart uses the default styles:</p>",
           "<p class='infotext'>This chart's labels are styled</p>",
           "<div class='chart' id='div_g' style='width:600px; height:300px;'></div>",
           "<p class='infotext'>This version of the chart uses the default styles:</p>",
@@ -21,10 +22,6 @@ Gallery.register(
               titleHeight: 32,
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
               titleHeight: 32,
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
-              labelsDivStyles: {
-                'text-align': 'right',
-                'background': 'none'
-              },
               strokeWidth: 1.5
             }
           );
               strokeWidth: 1.5
             }
           );
@@ -37,10 +34,6 @@ Gallery.register(
               title: 'High and Low Temperatures (30-day average)',
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
               title: 'High and Low Temperatures (30-day average)',
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
-              labelsDivStyles: {
-                'text-align': 'right',
-                'background': 'none'
-              },
               strokeWidth: 1.5
             }
           );
               strokeWidth: 1.5
             }
           );
index f2c9ad1..7e41310 100644 (file)
@@ -8,6 +8,7 @@ Gallery.register(
     title: 'Demo of a graph with many data points and custom error bars.',
     setup: function(parent) {
       parent.innerHTML = [
     title: 'Demo of a graph with many data points and custom error bars.',
     setup: function(parent) {
       parent.innerHTML = [
+          "<style>.dygraph-legend { text-align: right; }</style>",
           "<p>Roll period of 14 timesteps.</p>",
           "<div id='roll14' style='width:600px; height:300px;'></div>",
           "<p>No roll period.</p>",
           "<p>Roll period of 14 timesteps.</p>",
           "<div id='roll14' style='width:600px; height:300px;'></div>",
           "<p>No roll period.</p>",
@@ -23,7 +24,6 @@ Gallery.register(
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' }
           }
       );
       new Dygraph(
           }
       );
       new Dygraph(
@@ -36,7 +36,6 @@ Gallery.register(
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' }
           }
       );
     }
           }
       );
     }
index a003497..4e4538d 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Native format annotations</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
   </head>
     <title>Native format annotations</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
   </head>
index 6d477e2..4cdcb10 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>demo</title>
     <!--
     <script type="text/javascript" src="dygraph-combined.js"></script>
     <title>demo</title>
     <!--
     <script type="text/javascript" src="dygraph-combined.js"></script>
index a688770..b89e52d 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
index 89c8313..03dc0a1 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>gadget border</title>
     <!--
     For production (minified) code, use:
     <title>gadget border</title>
     <!--
     For production (minified) code, use:
@@ -13,6 +14,9 @@
     #bordered {
       border: 1px solid red;
     }
     #bordered {
       border: 1px solid red;
     }
+    .dygraph-legend {
+      border: 1px solid black;
+    }
     </style>
   </head>
   <body>
     </style>
   </head>
   <body>
@@ -21,7 +25,6 @@
     <script type="text/javascript">
     var g = new Dygraph(document.getElementById('bordered'), data,
     {
     <script type="text/javascript">
     var g = new Dygraph(document.getElementById('bordered'), data,
     {
-      labelsDivStyles: { border: '1px solid black' },
       title: 'Chart Title',
       xlabel: 'Date',
       ylabel: 'Temperature (F)'
       title: 'Chart Title',
       xlabel: 'Date',
       ylabel: 'Temperature (F)'
index c659930..fc3450c 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>callbacks</title>
     <!--
     For production (minified) code, use:
     <title>callbacks</title>
     <!--
     For production (minified) code, use:
index 8423715..4dad758 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>demo</title>
     <!--
     For production (minified) code, use:
     <title>demo</title>
     <!--
     For production (minified) code, use:
index 8f2ecaf..18157a6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Charting combinations</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <script type="text/javascript" src="data.js"></script>
     <title>Charting combinations</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <script type="text/javascript" src="data.js"></script>
index 53da503..9cbf071 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>color cycles</title>
     <!--
     For production (minified) code, use:
     <title>color cycles</title>
     <!--
     For production (minified) code, use:
index c0e6941..73a3b6a 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>color visibility</title>
     <!--
     For production (minified) code, use:
     <title>color visibility</title>
     <!--
     For production (minified) code, use:
index ef6034d..f0d8294 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>connect separated</title>
     <!--
     For production (minified) code, use:
     <title>connect separated</title>
     <!--
     For production (minified) code, use:
index 25eb8d8..dffdf03 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>crosshairs</title>
     <!--
     For production (minified) code, use:
     <title>crosshairs</title>
     <!--
     For production (minified) code, use:
index 2db8d69..11238c5 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style>
     <title>demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style>
index faa08ad..a2f633e 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>custom bars</title>
     <!--
     For production (minified) code, use:
     <title>custom bars</title>
     <!--
     For production (minified) code, use:
index 55cc0bb..5f988f2 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Custom Circles</title>
     <!--
     For production (minified) code, use:
     <title>Custom Circles</title>
     <!--
     For production (minified) code, use:
index c4ebee7..74fc6d6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
index 2b1b55a..ae08bf7 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
@@ -9,6 +10,16 @@
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <script type="text/javascript" src="data.js"></script>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <script type="text/javascript" src="data.js"></script>
+    <style>
+      .dygraph-legend {
+        background-color: rgba(200, 200, 255, 0.75);
+        padding: 4px;
+        border: 1px solid black;
+        border-radius: 10px;
+        box-shadow: 4px 4px 4px #888;
+        width: 100px;
+      }
+    </style>
   </head>
   <body>
     <p>Labels are styled with css3:</p>
   </head>
   <body>
     <p>Labels are styled with css3:</p>
             NoisyData, {
               rollPeriod: 14,
               errorBars: true,
             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,
               axes: {
                 y: {
               labelsSeparateLines: true,
               axes: {
                 y: {
index 96926e4..89c7969 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dateWindow</title>
     <!--
     For production (minified) code, use:
     <title>dateWindow</title>
     <!--
     For production (minified) code, use:
index b52a654..2e250aa 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Daylight Savings</title>
     <!--
     For production (minified) code, use:
     <title>Daylight Savings</title>
     <!--
     For production (minified) code, use:
index 2c72699..af01cc5 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>demo</title>
     <!--
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <title>demo</title>
     <!--
     <script type="text/javascript" src="../dist/dygraph.js"></script>
index d2d50fe..033600b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dense, filled plots</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style>
     <title>dense, filled plots</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style>
index 8b062ab..2a04a17 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>individual points</title>
     <!--
     For production (minified) code, use:
     <title>individual points</title>
     <!--
     For production (minified) code, use:
index 270b44e..03a9b50 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Dygraphs Drawing Demo</title>
     <!--
     For production (minified) code, use:
     <title>Dygraphs Drawing Demo</title>
     <!--
     For production (minified) code, use:
index 5b94eb3..5f98755 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Benchmarking for Plots with Many Points</title>
     <!--
     For production (minified) code, use:
     <title>Benchmarking for Plots with Many Points</title>
     <!--
     For production (minified) code, use:
index 6795b8c..dd282d1 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
index 12b46a5..22f53be 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Live random data</title>
     <!--
     For production (minified) code, use:
     <title>Live random data</title>
     <!--
     For production (minified) code, use:
index 0800823..698f2c0 100644 (file)
@@ -1,6 +1,7 @@
 <!doctype html>
 <html>
   <head>
 <!doctype html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Exported Symbols test</title>
   </head>
   <body>
     <title>Exported Symbols test</title>
   </head>
   <body>
index 751838e..9a952d4 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>fillGraph with per series fillAlpha</title>
     <!--
     For production (minified) code, use:
     <title>fillGraph with per series fillAlpha</title>
     <!--
     For production (minified) code, use:
index d21770d..3e03cd2 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>fillGraph</title>
     <!--
     For production (minified) code, use:
     <title>fillGraph</title>
     <!--
     For production (minified) code, use:
index d4dec6a..4e7ac3d 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Fractions</title>
     <!--
     For production (minified) code, use:
     <title>Fractions</title>
     <!--
     For production (minified) code, use:
index 3259468..ec783ae 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Custom grid and Dot</title>
     <!--
     For production (minified) code, use:
     <title>Custom grid and Dot</title>
     <!--
     For production (minified) code, use:
index aa2cc25..8694172 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>gviz</title>
     <!--
     For production (minified) code, use:
     <title>gviz</title>
     <!--
     For production (minified) code, use:
index 61dfaff..39a90d6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>gviz selection</title>
     <!--
     For production (minified) code, use:
     <title>gviz selection</title>
     <!--
     For production (minified) code, use:
index ba3953f..e06fcf9 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>gviz</title>
     <!--
     For production (minified) code, use:
     <title>gviz</title>
     <!--
     For production (minified) code, use:
index 1ffe163..6f03b39 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Hairlines demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <title>Hairlines demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
index be2986b..f932c86 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Highlighted Region</title>
     <!--
     For production (minified) code, use:
     <title>Highlighted Region</title>
     <!--
     For production (minified) code, use:
index 5b5a5c7..9a526d6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>hourly</title>
     <!--
     For production (minified) code, use:
     <title>hourly</title>
     <!--
     For production (minified) code, use:
index d3189f9..93f40df 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <title>demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
index 1a2153f..b9f07bf 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Independent Series</title>
     <!--
     For production (minified) code, use:
     <title>Independent Series</title>
     <!--
     For production (minified) code, use:
index 8b64843..6d35238 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>interaction model</title>
     <!--
     For production (minified) code, use:
     <title>interaction model</title>
     <!--
     For production (minified) code, use:
index 134dec9..cffc8be 100644 (file)
@@ -1,5 +1,6 @@
 <html>
   <head>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>isZoomedIgnoreProgrammaticZoom Flag</title>
     <!--
     For production (minified) code, use:
     <title>isZoomedIgnoreProgrammaticZoom Flag</title>
     <!--
     For production (minified) code, use:
index e3d72ce..1becb2e 100644 (file)
@@ -1,5 +1,6 @@
 <html>
   <head>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>isZoomedIgnoresProgrammaticZoom Flag</title>
     <!--
     For production (minified) code, use:
     <title>isZoomedIgnoresProgrammaticZoom Flag</title>
     <!--
     For production (minified) code, use:
index 6b8e7d4..045fbad 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>isolated points</title>
     <!--
     For production (minified) code, use:
     <title>isolated points</title>
     <!--
     For production (minified) code, use:
index 47f1199..b3cd9b6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>label-div</title>
     <!--
     For production (minified) code, use:
     <title>label-div</title>
     <!--
     For production (minified) code, use:
index fe26753..27b7101 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>UTC date labels</title>
     <!--
     For production (minified) code, use:
     <title>UTC date labels</title>
     <!--
     For production (minified) code, use:
index 3b44160..fc125c8 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>labelsKMB</title>
     <!--
     For production (minified) code, use:
     <title>labelsKMB</title>
     <!--
     For production (minified) code, use:
index 1051976..c4f7ce7 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Layout Options</title>
     <!--
     For production (minified) code, use:
     <title>Layout Options</title>
     <!--
     For production (minified) code, use:
index 10b7c94..b1c506a 100644 (file)
@@ -1,4 +1,5 @@
 <!DOCTYPE html>
 <!DOCTYPE html>
+    <link rel="stylesheet" href="../css/dygraph.css">
 <title>legendFormatter</title>
 <style>
 #demodiv {
 <title>legendFormatter</title>
 <style>
 #demodiv {
index c5eec30..da61c0a 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
     <title>Label styles</title>
     <!--
     For production (minified) code, use:
@@ -17,6 +18,7 @@
         border-radius: 10px;
         box-shadow: 4px 4px 4px #888;
         pointer-events: none;
         border-radius: 10px;
         box-shadow: 4px 4px 4px #888;
         pointer-events: none;
+        width: 100px;
       }
       pre {
         margin-top: 30px;
       }
       pre {
         margin-top: 30px;
@@ -52,7 +54,6 @@
       var baseOpts = {
         rollPeriod: 14,
         errorBars: true,
       var baseOpts = {
         rollPeriod: 14,
         errorBars: true,
-        labelsDivWidth: 100,
         labelsSeparateLines: true
       };
 
         labelsSeparateLines: true
       };
 
index f5becaf..2efffb1 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
index a2306bb..54c299a 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
index 5caae90..873e7ca 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
     <title>Linear Regression</title>
     <!--
     For production (minified) code, use:
index 93a0bab..c49ac42 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>noise</title>
     <!--
     For production (minified) code, use:
     <title>noise</title>
     <!--
     For production (minified) code, use:
index fda64dd..ca21b92 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>log scale</title>
     <!--
     For production (minified) code, use:
     <title>log scale</title>
     <!--
     For production (minified) code, use:
index f337de5..3fd8d60 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>missing data</title>
     <!--
     For production (minified) code, use:
     <title>missing data</title>
     <!--
     For production (minified) code, use:
index 478111b..d49fdad 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>multi-scale</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style type="text/css">
     <title>multi-scale</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <style type="text/css">
index 178aefc..2cf59cd 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Native Format</title>
     <!--
     For production (minified) code, use:
     <title>Native Format</title>
     <!--
     For production (minified) code, use:
index 8a2ad22..e3baf20 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>negatives</title>
     <!--
     For production (minified) code, use:
     <title>negatives</title>
     <!--
     For production (minified) code, use:
index 2984c50..e05a40c 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>no range</title>
     <!--
     For production (minified) code, use:
     <title>no range</title>
     <!--
     For production (minified) code, use:
index f01bf3f..b253433 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>no-visibility</title>
     <!--
     For production (minified) code, use:
     <title>no-visibility</title>
     <!--
     For production (minified) code, use:
index c81896d..3f604d2 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Test of number formatting</title>
     <!--
     For production (minified) code, use:
     <title>Test of number formatting</title>
     <!--
     For production (minified) code, use:
index 5c6ebb5..a864f6b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>numeric axis</title>
     <!--
     For production (minified) code, use:
     <title>numeric axis</title>
     <!--
     For production (minified) code, use:
index 800680d..fbffd50 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>numeric gviz</title>
     <!--
     For production (minified) code, use:
     <title>numeric gviz</title>
     <!--
     For production (minified) code, use:
index 153856a..c3e6741 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>out of order</title>
     <!--
     For production (minified) code, use:
     <title>out of order</title>
     <!--
     For production (minified) code, use:
index 60448ba..a35f767 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Per-Series Properties</title>
     <!--
     For production (minified) code, use:
     <title>Per-Series Properties</title>
     <!--
     For production (minified) code, use:
index 20bca86..739d224 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>perf</title>
     <!--
     For production (minified) code, use:
     <title>perf</title>
     <!--
     For production (minified) code, use:
index 38a76f8..e49032a 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dygraphs Equation Plotter</title>
     <!--
     For production (minified) code, use:
     <title>dygraphs Equation Plotter</title>
     <!--
     For production (minified) code, use:
index 6ece182..b56ca1f 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Plotters demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <title>Plotters demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
index 92cd104..f7610bd 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>plugins demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <title>plugins demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
index b257fe4..ac8e752 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Temperatures with Range Selector</title>
     <!--
     For production (minified) code, use:
     <title>Temperatures with Range Selector</title>
     <!--
     For production (minified) code, use:
       background-color: #101015;
       color: white;
     }
       background-color: #101015;
       color: white;
     }
+    #darkbg1 .dygraph-axis-label, #darkbg2 .dygraph-axis-label {
+      color: white;
+    }
+    #noroll .dygraph-legend,
+    #roll14 .dygraph-legend,
+    #darkbg1 .dygraph-legend,
+    #darkbg2 .dygraph-legend {
+      text-align: right;
+    }
+    #darkbg1 .dygraph-legend {
+      background-color: #101015;
+    }
+    #darkbg2 .dygraph-legend {
+      background-color: #101015;
+    }
     </style>
   </head>
   <body>
     </style>
   </head>
   <body>
@@ -61,7 +77,6 @@
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' },
             showRangeSelector: true
           }
       );
             showRangeSelector: true
           }
       );
@@ -75,7 +90,6 @@
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' },
             xAxisHeight: 14,
             showRangeSelector: true,
             rangeSelectorHeight: 80,
             xAxisHeight: 14,
             showRangeSelector: true,
             rangeSelectorHeight: 80,
               title: 'Nightly Temperatures in NY vs. SF',
               ylabel: 'Temperature (F)',
               legend: 'always',
               title: 'Nightly Temperatures in NY vs. SF',
               ylabel: 'Temperature (F)',
               legend: 'always',
-              labelsDivStyles: { 'textAlign': 'right', 'backgroundColor': '#101015' },
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
               rangeSelectorPlotFillGradientColor: 'rgba(123, 104, 238, 0)',
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
               rangeSelectorPlotFillGradientColor: 'rgba(123, 104, 238, 0)',
-              axisLabelColor: 'white',
               colorValue: 0.9,
               fillAlpha: 0.4
           }
               colorValue: 0.9,
               fillAlpha: 0.4
           }
               title: 'Nightly Temperatures in NY vs. SF',
               ylabel: 'Temperature (F)',
               legend: 'always',
               title: 'Nightly Temperatures in NY vs. SF',
               ylabel: 'Temperature (F)',
               legend: 'always',
-              labelsDivStyles: { 'textAlign': 'right', 'backgroundColor': '#101015' },
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
               showRangeSelector: true,
               rangeSelectorPlotFillColor: 'MediumSlateBlue',
-              axisLabelColor: 'white',
               colorValue: 0.9,
               fillAlpha: 0.4
           }
               colorValue: 0.9,
               fillAlpha: 0.4
           }
index bbc120d..343aa6b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>resize the window</title>
     <!--
     For production (minified) code, use:
     <title>resize the window</title>
     <!--
     For production (minified) code, use:
index 253a9f7..99a7173 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>reverse y-axis</title>
     <!--
     For production (minified) code, use:
     <title>reverse y-axis</title>
     <!--
     For production (minified) code, use:
index 6abb715..8dc8d0b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Series highlighting</title>
     <!--
     For production (minified) code, use:
     <title>Series highlighting</title>
     <!--
     For production (minified) code, use:
index 0f202dd..4f8bf8c 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>no range</title>
     <!--
     For production (minified) code, use:
     <title>no range</title>
     <!--
     For production (minified) code, use:
index 55ebb1c..e051574 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Plotters demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <script type="text/javascript" src="../src/extras/smooth-plotter.js"></script>
     <title>Plotters demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
     <script type="text/javascript" src="../src/extras/smooth-plotter.js"></script>
index 18f4e4d..8d9292b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>spacing</title>
     <!--
     For production (minified) code, use:
     <title>spacing</title>
     <!--
     For production (minified) code, use:
index 65e5089..e6f6210 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>stacked</title>
     <!--
     For production (minified) code, use:
     <title>stacked</title>
     <!--
     For production (minified) code, use:
index 71de53c..e67f45d 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
     <title>dygraph</title>
     <!--
     For production (minified) code, use:
index 622788b..4656dd5 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Stock chart</title>
     <!--
     For production (minified) code, use:
     <title>Stock chart</title>
     <!--
     For production (minified) code, use:
index 0a13b69..7628f49 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Straw broom charts demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
     <title>Straw broom charts demo</title>
     <script type="text/javascript" src="../dist/dygraph.js"></script>
 
index 07a43b9..35c0b5a 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>two series</title>
     <!--
     For production (minified) code, use:
     <title>two series</title>
     <!--
     For production (minified) code, use:
       margin: 5px;
       padding: 2px;
     }
       margin: 5px;
       padding: 2px;
     }
+    .dygraph-legend {
+      text-align: right;
+      background: none;
+    }
     </style>
   </head>
   <body>
     </style>
   </head>
   <body>
               titleHeight: 32,
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
               titleHeight: 32,
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
-              labelsDivStyles: {
-                'text-align': 'right',
-                'background': 'none'
-              },
               strokeWidth: 1.5
             }
           );
               strokeWidth: 1.5
             }
           );
               title: 'High and Low Temperatures (30-day average)',
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
               title: 'High and Low Temperatures (30-day average)',
               ylabel: 'Temperature (F)',
               xlabel: 'Date (Ticks indicate the start of the indicated time period)',
-              labelsDivStyles: {
-                'text-align': 'right',
-                'background': 'none'
-              },
               strokeWidth: 1.5
             }
           );
               strokeWidth: 1.5
             }
           );
index c14ef64..70c264b 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>synchronize</title>
     <!--
     For production (minified) code, use:
     <title>synchronize</title>
     <!--
     For production (minified) code, use:
index b5cfef1..a778d77 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html> 
 <html> 
   <head> 
 <!DOCTYPE html> 
 <html> 
   <head> 
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Temperatures</title> 
     <!--
     For production (minified) code, use:
     <title>Temperatures</title> 
     <!--
     For production (minified) code, use:
@@ -13,6 +14,9 @@
     #bordered {
       border: 1px solid red;
     }
     #bordered {
       border: 1px solid red;
     }
+    .dygraph-legend {
+      text-align: right;
+    }
     </style> 
   </head> 
   <body> 
     </style> 
   </head> 
   <body> 
@@ -34,7 +38,6 @@
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' }
           }
       );
       g2 = new Dygraph(
           }
       );
       g2 = new Dygraph(
@@ -47,7 +50,6 @@
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
             title: 'Daily Temperatures in New York vs. San Francisco',
             ylabel: 'Temperature (F)',
             legend: 'always',
-            labelsDivStyles: { 'textAlign': 'right' }
           }
       );
     </script> 
           }
       );
     </script> 
index b714b36..c1ebfb2 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Multiple y-axes with valueRange</title>
     <!--
     For production (minified) code, use:
     <title>Multiple y-axes with valueRange</title>
     <!--
     For production (minified) code, use:
index f652389..fa187c6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Multiple y-axes</title>
     <!--
     For production (minified) code, use:
     <title>Multiple y-axes</title>
     <!--
     For production (minified) code, use:
index 2713467..3dc8968 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>dygraphs unboxed</title>
     <!--
     For production (minified) code, use:
     <title>dygraphs unboxed</title>
     <!--
     For production (minified) code, use:
index 11b2764..f552b11 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>Custom underlay callback</title>
     <!--
     For production (minified) code, use:
     <title>Custom underlay callback</title>
     <!--
     For production (minified) code, use:
index 31d61ea..caffab4 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>valueFormatter and axisLabelFormatter</title>
     <!--
     For production (minified) code, use:
     <title>valueFormatter and axisLabelFormatter</title>
     <!--
     For production (minified) code, use:
index 43b73a5..53c14fe 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>visibility</title>
     <!--
     For production (minified) code, use:
     <title>visibility</title>
     <!--
     For production (minified) code, use:
index ef884e3..63b9e05 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>X Axis Label Formatting</title>
     <!--
     For production (minified) code, use:
     <title>X Axis Label Formatting</title>
     <!--
     For production (minified) code, use:
index 72c4baa..100bca1 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>zero series</title>
     <!--
     For production (minified) code, use:
     <title>zero series</title>
     <!--
     For production (minified) code, use:
index afc39a3..5803af6 100644 (file)
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html>
   <head>
 <!DOCTYPE html>
 <html>
   <head>
+    <link rel="stylesheet" href="../css/dygraph.css">
     <title>zoom</title>
     <!--
     For production (minified) code, use:
     <title>zoom</title>
     <!--
     For production (minified) code, use: