1.项目添加 Chart.bundle.js 、utils.js文件
2.jsp写入标签
3. 标签内画图实例代码如下:
var lineChartData = {
type: 'line', //为图表类型:line 曲线图 bar 柱状图等等,详细请查阅api
data: {
labels: ["周一","周二","周三","周四","周五","周六"],
datasets: [{
label: '本周',
backgroundColor: window.chartColors.red,
borderColor: window.chartColors.red,
data: [<%=nums%>], //为后台传入数据以逗号隔开
fill: false,
}]
},
options: {
responsive: true,
title: {
display: true,
text: ''
},
tooltips: {
mode: 'index',
intersect: false,
},
hover: {
mode: 'nearest',
intersect: true
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: ''
}
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: ''
}
}]
}
}
};
window.onload = function() {
var ctx = document.getElementById('line').getContext('2d');
window.myLine = new Chart(ctx, lineChartData);
};//执行绘图js