+<!DOCTYPE html>
<html>
<head>
- <title>noise</title>
- <!--[if IE]>
- <script type="text/javascript" src="excanvas.js"></script>
- <![endif]-->
- <script type="text/javascript" src="../dygraph-combined.js"></script>
- <script type="text/javascript" src="../dygraph-canvas.js"></script>
- <script type="text/javascript" src="../dygraph.js"></script>
+ <link rel="stylesheet" href="../dist/dygraph.css">
+ <title>demo</title>
+
+ <script type="text/javascript" src="../dist/dygraph.js"></script>
</head>
<body>
<h2>Demo</h2>
<font size=-1>(Mouse over to highlight individual values. Click and drag to zoom. Double-click to zoom out.)</font><br/>
<table><tr><td>
- <div id="demodiv" style="width:480px; height:320px;"></div>
+ <div id="demodiv"></div>
</td><td valign=top>
<div id="status" style="width:200px; font-size:0.8em; padding-top:5px;"></div>
</td>
</tr></table>
<script type="text/javascript">
- g = new DateGraph(
+ g = new Dygraph(
document.getElementById("demodiv"),
function() {
var zp = function(x) { if (x < 10) return "0"+x; else return x; };
}
return r;
},
- null,
{
- rollPeriod: 1,
labelsDiv: document.getElementById('status'),
labelsSeparateLines: true,
labelsKMB: true,
+ legend: 'always',
colors: ["rgb(51,204,204)",
"rgb(255,100,100)",
"#00DD55",
"rgba(50,50,200,0.4)"],
- padding: {left: 40, right: 30, top: 15, bottom: 15}
+ width: 640,
+ height: 480,
+ title: 'Interesting Shapes',
+ xlabel: 'Date',
+ ylabel: 'Count',
+ axisLineColor: 'white',
+ showRangeSelector: true
+ // drawXGrid: false
}
);
</script>