OLD | NEW |
| (Empty) |
1 <!doctype html> | |
2 | |
3 <!--[if lte IE 8]><SCRIPT src='source/excanvas.js'></script><![endif]--><SCRIPT
src='../ChartNew.js'></script> | |
4 <SCRIPT src='../Add-ins/format.js'></script> | |
5 | |
6 <SCRIPT> | |
7 | |
8 defCanvasWidth=1200; | |
9 defCanvasHeight=600; | |
10 | |
11 | |
12 var mydata1 = { | |
13 labels : ["-10","0","10"], | |
14 xBegin : -10, | |
15 xEnd : 10, | |
16 datasets : [ | |
17 { | |
18 strokeColor : "rgba(220,220,220,1)", | |
19 data : [], | |
20 xPos : [], | |
21 title : "Sinus" | |
22 } | |
23 ] | |
24 } | |
25 var nbiter=400; | |
26 for(var i=0;i<nbiter;i++) | |
27 { | |
28 mydata1.datasets[0].xPos[i]=mydata1.xBegin+i*(mydata1.xEnd-mydata1.xBegin)/nbi
ter; | |
29 mydata1.datasets[0].data[i]=mydata1.datasets[0].xPos[i]*mydata1.datasets[0].xP
os[i]; | |
30 } | |
31 | |
32 | |
33 var opt1 = { | |
34 canvasBorders : true, | |
35 canvasBordersWidth : 3, | |
36 canvasBordersColor : "black", | |
37 graphTitle : "x^2", | |
38 legend : true, | |
39 datasetFill : false, | |
40 annotateDisplay : true, | |
41 pointDot :false, | |
42 animationLeftToRight : true, | |
43 animationEasing: "linear", | |
44 yAxisMinimumInterval : 1, | |
45 graphTitleFontSize: 18 | |
46 | |
47 } | |
48 | |
49 | |
50 </SCRIPT> | |
51 | |
52 | |
53 <html> | |
54 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> | |
55 <head> | |
56 <title>Demo ChartNew.js</title> | |
57 </head> | |
58 <body> | |
59 | |
60 <center> | |
61 <FONT SIZE=6><B>Demo of ChartNew.js !</B></FONT> <BR> | |
62 | |
63 <script> | |
64 | |
65 document.write("<canvas id=\"canvas_Line1\" height=\""+defCanvasHeight+"\" w
idth=\""+defCanvasWidth+"\"></canvas>"); | |
66 window.onload = function() { | |
67 var myLine = new Chart(document.getElementById("canvas_Line1").getContext("2
d")).Line(mydata1,opt1); | |
68 } | |
69 </script> | |
70 </body> | |
71 </html> | |
OLD | NEW |