Commit | Line | Data |
---|---|---|
6bef45dc DV |
1 | <html> |
2 | <head> | |
3 | <title>dygraphs Equation Plotter</title> | |
4 | <!--[if IE]> | |
5 | <script type="text/javascript" src="excanvas.js"></script> | |
6 | <![endif]--> | |
7 | <script type="text/javascript" src="../dygraph-combined.js"></script> | |
8 | <script type="text/javascript" src="../dygraph-canvas.js"></script> | |
9 | <script type="text/javascript" src="../dygraph.js"></script> | |
10 | <script type="text/javascript"> | |
11 | function plot() { | |
12 | var eq = document.getElementById("eq").value; | |
13 | eval("fn = " + eq); | |
14 | ||
15 | var graph = document.getElementById("graph"); | |
16 | var width = parseInt(graph.style.width); | |
17 | var x1 = parseFloat(document.getElementById("x1").value); | |
18 | var x2 = parseFloat(document.getElementById("x2").value); | |
19 | var xs = 1.0 * (x2 - x1) / width; | |
20 | ||
21 | var data = []; | |
22 | for (var i = 0; i < width; i++) { | |
23 | var x = x1 + i * xs; | |
24 | var y = fn(x); | |
25 | data.push([x, y]); | |
26 | } | |
27 | ||
28 | g = new Dygraph(graph, data, { labels: ["x", "y"] }); | |
29 | } | |
30 | </script> | |
31 | </head> | |
32 | <body> | |
33 | <p><b>Equation: </b><br/> | |
34 | <textarea cols="40" rows="10" id="eq">function(x) { | |
35 | return Math.sin(x); | |
36 | }</textarea> | |
37 | </p> | |
38 | <p><b>x range: </b> <input type=text width="5" id="x1" value="-10" /> | |
39 | to <input type=text width="5" id="x2" value="10" /></p> | |
40 | <p><input type=button value="Plot" onClick="plot()" /></p> | |
41 | ||
42 | <div id=graph style="width:1024px; height:400px;"></div> | |
43 | </body> | |
44 | </html> |