chartnew.js
Version:
Simple HTML5 Charts using the canvas element
59 lines (52 loc) • 1.48 kB
HTML
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<title></title>
<SCRIPT src='../mathFunctions.js'></script>
<!--[if lte IE 8]><SCRIPT src='source/excanvas.js'></script><![endif]--><SCRIPT src='../ChartNew.js'></script>
</head>
<body>
<canvas id="mycanvas" height="600" width="800"></canvas>
<script>
function deviationValue(params) {
var data = params.data;
var datasetNr = params.datasetNr;
return(data.datasets[datasetNr].deviationValue);
}
var BarData = {
labels : ["v1","v2","v3"],
datasets : [
{
strokeColor : "red",
pointColor : "red",
pointStrokeColor : "#fff",
drawMathDeviation: "deviationValue",
deviationStrokeColor: "red",
deviationWidth: 5,
deviationValue : [3,8,2],
data : [60,70,50],
title : "line 1"
},
{
strokeColor : "green",
pointColor : "green",
pointStrokeColor : "#fff",
drawMathDeviation: "deviationValue",
deviationStrokeColor: "green",
deviationWidth: 5,
deviationValue : [10,20,10],
data : [80,10,30],
title : "line 2"
}
]
}
var opts= { legend: true,datasetFill : false, bezierCurve : false, graphMin : -20
};
window.onload = function() {
var myBar = new Chart(document.getElementById("mycanvas").getContext("2d")).Line(BarData,opts);
}
</script>
</body>
</html>