tests/fillStepPlot.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
   5     <title>dygraph</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   </head>
  16   <body>
  17     <p>1: Showing the fill problem near the gap due to the null value:</p>
  18     <div id="graph1"></div>
  19     <script type="text/javascript">
  20         var g1 = new Dygraph(document.getElementById("graph1"),
  21         [
  22           [1,3],
  23           [2,0],
  24           [3,8],
  25           [4,null],
  26           [5,9],
  27           [6,8],
  28           [7,6],
  29           [8,3]
  30         ],
  31         {
  32           labels: ["x1","y1"],
  33           fillGraph: true,
  34           stepPlot: true
  35         });
  36     </script>
  37
  38     <p>2: Showing the proper fill with the fillStepPlot option:</p>
  39     <div id="graph2"></div>
  40     <script type="text/javascript">
  41         var g2 = new Dygraph(document.getElementById("graph2"),
  42         [
  43           [1,3],
  44           [2,0],
  45           [3,8],
  46           [4,null],
  47           [5,9],
  48           [6,8],
  49           [7,6],
  50           [8,3]
  51         ],
  52         {
  53           labels: ["x2","y2"],
  54           fillGraph: true,
  55           stepPlot: true,
  56           fillStepPlot: true
  57         });
  58     </script>
  59
  60   </body>
  61 </html>