Use CSS for styling

[dygraphs.git] / tests / styled-chart-labels.html
diff --git a/tests/styled-chart-labels.html b/tests/styled-chart-labels.html

index c9f9e71..07a43b9 100644 (file)
--- a/tests/styled-chart-labels.html
+++ b/tests/styled-chart-labels.html
@@ -1,15 +1,13 @@
  <!DOCTYPE html>
  <html>
    <head>
-    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
      <title>two series</title>
-    <!--[if IE]>
-    <script type="text/javascript" src="../excanvas.js"></script>
-    <![endif]-->
-    <script type="text/javascript" src="../strftime/strftime-min.js"></script>
-    <script type="text/javascript" src="../rgbcolor/rgbcolor.js"></script>
-    <script type="text/javascript" src="../dygraph-canvas.js"></script>
-    <script type="text/javascript" src="../dygraph.js"></script>
+    <!--
+    For production (minified) code, use:
+    <script type="text/javascript" src="dygraph-combined.js"></script>
+    -->
+    <script type="text/javascript" src="../dist/dygraph.js"></script>
+
      <script type="text/javascript" src="data.js"></script>
      <style type="text/css">
      #div_g .dygraph-label {
@@ -26,16 +24,21 @@
        font-size: 18px;
        text-shadow: gray -2px 2px 2px;  /* (offsets are in a rotated frame) */
      }
+    .chart {
+      border: 1px dashed black;
+      margin: 5px;
+      padding: 2px;
+    }
      </style>
    </head>
    <body>
      <p>In this chart, each chart label is styled independently. View source to
      see how it works.</p>
  
-    <div id="div_g" style="width:600px; height:300px;"></div>
+    <div class="chart" id="div_g" style="width:600px; height:300px;"></div>
  
      <p>This version of the chart uses the default styles:</p>
-    <div id="div_g2" style="width:600px; height:300px;"></div>
+    <div class="chart" id="div_g2" style="width:600px; height:300px;"></div>
  
      <script type="text/javascript">
        g = new Dygraph(
@@ -46,7 +49,7 @@
                title: 'High and Low Temperatures',
                titleHeight: 32,
                ylabel: 'Temperature (F)',
-              xlabel: 'Date (Pacific Time Zone)',
+              xlabel: 'Date (Ticks indicate the start of the indicated time period)',
                labelsDivStyles: {
                  'text-align': 'right',
                  'background': 'none'
@@ -62,7 +65,7 @@
                legend: 'always',
                title: 'High and Low Temperatures (30-day average)',
                ylabel: 'Temperature (F)',
-              xlabel: 'Date (Pacific Time Zone)',
+              xlabel: 'Date (Ticks indicate the start of the indicated time period)',
                labelsDivStyles: {
                  'text-align': 'right',
                  'background': 'none'