chart.js制作折线图 

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<script src="Chart.js-master/Chart.min.js"></script>
<body>
<div class="canvasWrapper">
<canvas id="myChart" width="600" height="400"></canvas>    
</div>
</body>
<script>
        var data = {
            labels : ["January","February","March","April","May","June","July","444"],
            datasets : [
                {
                    fillColor : "rgba(220,220,220,0.5)",
                    strokeColor : "rgba(220,220,220,1)",
                    pointColor : "rgba(220,220,220,1)",
                    pointStrokeColor : "#fff",
                    data : [65,59,90,81,56,55,40,99]
                },
                {
                    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,0]
                }
            ]
            
        }


    var ctx = document.getElementById("myChart").getContext("2d");
    new Chart(ctx).Line(data);
        
</script>
</html>
View Code

http://pan.baidu.com/s/1hqwbBZu

 

posted @ 2015-11-04 15:40  ordinary01  阅读(3654)  评论(0)  编辑  收藏  举报