--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
+ <title>dygraphs unboxed</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>
+ <script type="text/javascript" src="data.js"></script>
+ <style type="text/css">
+ #div_spark {
+ display: inline;
+ }
+ </style>
+ </head>
+ <body>
+ <p>This shows dygraphs without any boxlike elements (i.e. axes or grids):</p>
+ <div id="div_g" style="width:600px; height:300px;"></div>
+
+ <script type="text/javascript">
+ var show_box = false;
+ g = new Dygraph(
+ document.getElementById("div_g"),
+ data, {
+ drawXAxis: show_box,
+ drawYAxis: show_box,
+ drawXGrid: show_box,
+ drawYGrid: show_box
+ }
+ );
+
+ function toggleBox(btn) {
+ show_box = !show_box;
+ document.getElementById("div_g").style.border = show_box ? '1px solid black' : '';
+ if (show_box) {
+ btn.innerHTML = 'Hide box';
+ } else {
+ btn.innerHTML = 'Show box';
+ }
+ }
+ </script>
+
+ <button onClick='toggleBox(this)'>Show box</button>
+
+ <!-- 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. -->
+ <p>
+ <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>
+ </p>
+
+ <script type="text/javascript">
+ new Dygraph(
+ document.getElementById("div_spark"),
+ data, {
+ drawXAxis: false,
+ drawYAxis: false,
+ drawXGrid: false,
+ drawYGrid: false,
+ strokeWidth: 1.0,
+ rollPeriod: 7,
+ labelsDiv: '',
+ highlightCircleSize: 2
+ }
+ );
+ </script>
+ </body>
+</html>
projects / dygraphs.git / commitdiff