4 <meta http-equiv=
"X-UA-Compatible" content=
"IE=EmulateIE7; IE=EmulateIE9">
5 <title>dygraphs unboxed
</title>
7 <script type=
"text/javascript" src=
"../excanvas.js"></script>
9 <script type=
"text/javascript" src=
"../strftime/strftime-min.js"></script>
10 <script type=
"text/javascript" src=
"../rgbcolor/rgbcolor.js"></script>
11 <script type=
"text/javascript" src=
"../dygraph-canvas.js"></script>
12 <script type=
"text/javascript" src=
"../dygraph.js"></script>
13 <script type=
"text/javascript" src=
"data.js"></script>
14 <style type=
"text/css">
21 <p>This shows dygraphs without any boxlike elements (i.e. axes or grids):
</p>
22 <div id=
"div_g" style=
"width:600px; height:300px; border:1px solid white;"></div>
24 <script type=
"text/javascript">
27 document.getElementById(
"div_g"),
36 function toggleBox(btn) {
38 document.getElementById(
"div_g").style.border = show_box ? '
1px solid black' : '
1px solid white';
40 btn.innerHTML = 'Hide box';
42 btn.innerHTML = 'Show box';
47 <button onClick='toggleBox(this)'
>Show box
</button>
49 <!-- Dygraphs constructs a div inside of whatever div we pass in. So the container div can't be a span or have display: inline-block. We use a table to get the sparkline to display on the same line as the text. --
>
51 <table><tr><td>This style can be used to produce interactive sparklines with dygraphs:
</td><td><div id=
"div_spark" style=
"width:100px; height:20px;"></div></td></tr></table>
54 <script type=
"text/javascript">
56 document.getElementById(
"div_spark"),
65 highlightCircleSize:
2