本文主要是介绍chart.js 最新版 (曲线图) 创建例子,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
说明:由于chart.js 的版本更新,按照第一版的关键字设置图表的颜色等关键字,已经不会生效,所以记录一下第二版chart曲线图表的创建。
<div><canvas id="canvas" width="400" height="450"></canvas>
</div>
<script src="/Chart.min.js"></script> <script>var ctx = document.getElementById("canvas").getContext("2d");var myChart = new Chart(ctx, {type: 'line', // line 表示是 曲线图,当然也可以设置其他的图表类型 如柱形图 : bar 或者其他data: {labels : ["January","February","March","April","May","June","July"], //按时间段 可以按星期,按月,按年datasets : [{label: "123", //当前数据的说明fill: true, //是否要显示数据部分阴影面积块 false:不显示borderColor: "rgba(200,187,205,1)",//数据曲线颜色pointBackgroundColor: "#fff", //数据点的颜色data: [80, 90, 100, 30, 67, 59, 88], //填充的数据},{label: "456", //当前数据的说明fill: true, //是否要显示数据部分阴影面积块 false:不显示borderColor: "rgba(75,192,192,1)",//数据曲线颜色pointBackgroundColor: "#fff", //数据点的颜色data: [21, 34, 35, 50, 45, 21, 70], //填充的数据}]}});
</script>
这篇关于chart.js 最新版 (曲线图) 创建例子的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!