OLD | NEW |
| (Empty) |
1 <!doctype html> | |
2 | |
3 | |
4 | |
5 | |
6 <!--[if lte IE 8]><SCRIPT src='source/excanvas.js'></script><![endif]--><SCRIPT
src='../ChartNew.js'></script> | |
7 | |
8 | |
9 <SCRIPT> | |
10 | |
11 defCanvasWidth=800; | |
12 defCanvasHeight=600; | |
13 | |
14 | |
15 var mydata2 = [ | |
16 { | |
17 value : 30, | |
18 color: "#D97041", | |
19 title : "data1" | |
20 }, | |
21 { | |
22 value : 90, | |
23 color: "#C7604C", | |
24 title : "data2" | |
25 }, | |
26 { | |
27 value : 24, | |
28 color: "#21323D", | |
29 title : "data3" | |
30 }, | |
31 { | |
32 value : 58, | |
33 color: "#9D9B7F", | |
34 title : "data4" | |
35 }, | |
36 { | |
37 value : 82, | |
38 color: "#7D4F6D", | |
39 title : "data5" | |
40 }, | |
41 { | |
42 value : 8, | |
43 color: "#584A5E", | |
44 title : "data6" | |
45 } | |
46 ] | |
47 | |
48 var smyley_1=new Image(); | |
49 smyley_1.src="smiley_150x150.jpg"; | |
50 var smyley_2=new Image(); | |
51 smyley_2.src="smiley_75x75.jpg"; | |
52 | |
53 | |
54 var crossImage1 = { | |
55 inGraphDataShow : true, | |
56 graphTitle : "Graph Title", | |
57 graphSubTitle : "Graph Sub Title", | |
58 footNote : "Footnote for the graph", | |
59 legend : true, | |
60 crossImage : [smyley_1,smyley_2,smyley_2,smyley_2,smyley_2], | |
61 crossImageRelativePosX : [2,0,0,4,4], | |
62 crossImageRelativePosY : [2,0,4,0,4], | |
63 crossImageAlign : ["center","left","left","right","right"], | |
64 crossImageBaseline : ["middle","top","bottom","top","bottom"], | |
65 | |
66 | |
67 crossImageIter : ["all"], | |
68 crossImageOverlay : [false] | |
69 } | |
70 | |
71 var background_img=new Image(); | |
72 background_img.src="background_800x600.jpg"; | |
73 | |
74 var crossImage2 = { | |
75 inGraphDataShow : true, | |
76 canvasBorders : true, | |
77 canvasBordersWidth : 3, | |
78 canvasBordersColor : "black", | |
79 graphTitle : "Graph Title", | |
80 graphSubTitle : "Graph Sub Title", | |
81 footNote : "Footnote for the graph", | |
82 legend : true, | |
83 animation : false, | |
84 crossImage : [background_img], | |
85 crossImageIter : ["background"], | |
86 crossImageOverlay : [false] | |
87 } | |
88 | |
89 | |
90 | |
91 | |
92 | |
93 </SCRIPT> | |
94 | |
95 | |
96 <html> | |
97 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> | |
98 <head> | |
99 <title>Demo ChartNew.js</title> | |
100 | |
101 </head> | |
102 <body> | |
103 | |
104 <!div id="divCursor" style="position:absolute"> <!/div> | |
105 | |
106 <center> | |
107 <FONT SIZE=6><B>Demo of ChartNew.js !</B></FONT> <BR> | |
108 | |
109 <script> | |
110 | |
111 | |
112 document.write("<canvas id=\"canvas_doughnut1\" height=\""+defCanvasHeight
+"\" width=\""+defCanvasWidth+"\"></canvas>"); | |
113 document.write("<canvas id=\"canvas_doughnut2\" height=\""+defCanvasHeight
+"\" width=\""+defCanvasWidth+"\"></canvas>"); | |
114 | |
115 | |
116 window.onload = function() { | |
117 | |
118 | |
119 var myLine = new Chart(document.getElementById("canvas_doughnut1").getContex
t("2d")).Doughnut(mydata2,crossImage1); | |
120 var myLine = new Chart(document.getElementById("canvas_doughnut2").getContex
t("2d")).Doughnut(mydata2,crossImage2); | |
121 | |
122 } | |
123 | |
124 </script> | |
125 </body> | |
126 </html> | |
OLD | NEW |