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 |
| 5 |
| 6 <SCRIPT> |
| 7 |
| 8 function setColor(area,data,config,i,j,animPct,value) |
| 9 { |
| 10 if(value > 35)return("rgba(220,0,0,"+animPct); |
| 11 else return("rgba(0,220,0,"+animPct); |
| 12 |
| 13 } |
| 14 |
| 15 var charJSPersonnalDefaultOptions = { decimalSeparator : "," , thousandSeparator
: ".", roundNumber : "none", graphTitleFontSize: 2 }; |
| 16 |
| 17 defCanvasWidth=600; |
| 18 defCanvasHeight=300; |
| 19 |
| 20 |
| 21 var mydata1 = { |
| 22 labels : ["January","February","March","April","May","June","July"], |
| 23 datasets : [ |
| 24 { |
| 25 type: "Line", |
| 26 fillColor : "rgba(0,200,0,1)", |
| 27 strokeColor : "rgba(0,200,0,1)", |
| 28 pointColor : "rgba(0,200,200,1)", |
| 29 pointstrokeColor : "green", |
| 30 axis : 2, |
| 31 data : [95,53,99,,73,27,82,], |
| 32 |
| 33 title : "2014" |
| 34 }, |
| 35 { |
| 36 fillColor : "rgba(151,187,205,0.5)", |
| 37 strokeColor : "rgba(151,187,205,1)", |
| 38 pointColor : "green", |
| 39 pointstrokeColor : "yellow", |
| 40 data : [35,43,59,,31,50,66,], |
| 41 axis : 1, |
| 42 title : "2013" |
| 43 } |
| 44 ] |
| 45 } |
| 46 |
| 47 var startWithDataset =1; |
| 48 var startWithData =1; |
| 49 |
| 50 var opt1 = { |
| 51 animation: false, |
| 52 canvasBorders : true, |
| 53 canvasBordersWidth : 3, |
| 54 canvasBordersColor : "black", |
| 55 graphTitle : "Graph Title", |
| 56 legend : true, |
| 57 inGraphDataShow : false, |
| 58 graphTitleFontSize: 18, |
| 59 yAxisRight : true |
| 60 |
| 61 } |
| 62 |
| 63 </SCRIPT> |
| 64 |
| 65 |
| 66 <html> |
| 67 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> |
| 68 <head> |
| 69 <title>Demo ChartNew.js</title> |
| 70 </head> |
| 71 <body> |
| 72 |
| 73 <center> |
| 74 <FONT SIZE=6><B>Demo of ChartNew.js !</B></FONT> <BR> |
| 75 |
| 76 <script> |
| 77 |
| 78 document.write("<canvas id=\"canvas_Line1\" height=\""+defCanvasHeight+"\" w
idth=\""+defCanvasWidth+"\"></canvas>"); |
| 79 |
| 80 window.onload = function() { |
| 81 |
| 82 |
| 83 var myLine = new Chart(document.getElementById("canvas_Line1").getContext("2
d")).Bar(mydata1,opt1); |
| 84 |
| 85 } |
| 86 </script> |
| 87 </body> |
| 88 </html> |
OLD | NEW |