<script src="/js/lib/html5/Chart/Chart.js"></script>
<script>
$(document).ready(function(){
//Get the context of the canvas element we want to select
var ctx = document.getElementById("line").getContext("2d");
var data = {
labels : ["January","February","March","April","May","June","July"],
datasets : [
{
fillColor : "rgba(220,187,151,0.5)",
strokeColor : "rgba(220,187,151,1)",
pointColor : "rgba(220,187,151,1)",
pointStrokeColor : "#fff",
data : [65,59,90,81,56,55,40]
},
{
fillColor : "rgba(151,187,205,0.5)",
strokeColor : "rgba(151,187,205,1)",
pointColor : "rgba(151,187,205,1)",
pointStrokeColor : "#fff",
data : [28,48,40,19,96,27,100]
}
]
}
new Chart(ctx).Line(data);
});
</script>
<div class="c b1 full gra1">
<div class="t">Chart.js</div>
<div class="desc">JSライブラリChart.jsを使った線グラフ</div>
<canvas id="line" width="250" height="250"></canvas>
</div>