customLabelFollow.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
   5     <title>Label styles</title>
   6     <!--[if IE]>
   7     <script type="text/javascript" src="../excanvas.js"></script>
   8     <![endif]-->
   9     <!--
  10     For production (minified) code, use:
  11     <script type="text/javascript" src="dygraph-combined.js"></script>
  12     -->
  13     <script type="text/javascript" src="../dygraph-dev.js"></script>
  14
  15     <script type="text/javascript" src="data.js"></script>
  16     <style type="text/css">
  17       .dygraph-legend {
  18         background-color: rgba(200, 200, 255, 0.75) !important;
  19         padding: 4px;
  20         border: 1px solid #000;
  21         border-radius: 10px;
  22         box-shadow: 4px 4px 4px #888;
  23         pointer-events: none;
  24       }
  25     </style>
  26   </head>
  27   <body>
  28     <p>Legend follows highlighted points:</p>
  29     <div id="div_g14" style="width:600px; height:300px;"></div>
  30
  31     <script type="text/javascript">
  32       g14 = new Dygraph(
  33             document.getElementById("div_g14"),
  34             NoisyData, {
  35               rollPeriod: 14,
  36               errorBars: true,
  37               labelsDivWidth: 100,
  38               labelsSeparateLines: true,
  39               legend: "follow",
  40               yAxisLabelWidth: 20
  41             }
  42           );
  43     </script>
  44   </body>
  45 </html>