tests/customLabelCss3.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <link rel="stylesheet" href="../css/dygraph.css">
   5     <title>Label styles</title>
   6     <!--
   7     For production (minified) code, use:
   8     <script type="text/javascript" src="dygraph-combined.js"></script>
   9     -->
  10     <script type="text/javascript" src="../dist/dygraph.js"></script>
  11
  12     <script type="text/javascript" src="data.js"></script>
  13     <style>
  14       .dygraph-legend {
  15         background-color: rgba(200, 200, 255, 0.75);
  16         padding: 4px;
  17         border: 1px solid black;
  18         border-radius: 10px;
  19         box-shadow: 4px 4px 4px #888;
  20         width: 100px;
  21       }
  22     </style>
  23   </head>
  24   <body>
  25     <p>Labels are styled with css3:</p>
  26     <div id="div_g14" style="width:600px; height:300px;"></div>
  27
  28     <script type="text/javascript">
  29       g14 = new Dygraph(
  30             document.getElementById("div_g14"),
  31             NoisyData, {
  32               rollPeriod: 14,
  33               errorBars: true,
  34               labelsSeparateLines: true,
  35               axes: {
  36                 y: {
  37                   axisLabelWidth: 20
  38                 }
  39               }
  40             }
  41           );
  42     </script>
  43   </body>
  44 </html>