我使用chart.js制作了折线图,但无法更改图表的色线,我看到它是灰色的。
我的代码是...
$(document).ready(function(){
$.ajax({
url: "chart/maderas_Chart.php",
method: "GET",
success: function(data) {
console.log(data);
var hora = [];
var valor = [];
for(var i in data) {
hora.push("Hora " + data[i].hora_nueva);
valor.push(data[i].valor);
}
var chartdata = {
labels: hora,
datasets : [
{
label: 'Dique Las Maderas',
fill: false,
boderColor: "#bae755",
borderDash: [5, 5],
strokeColor: "#e755ba",
pointColor: "#55bae7",
pointStrokeColor: "#55bae7",
pointHighlightFill: "#55bae7",
pointHighlightStroke:"#55bae7",
data: valor
}
]
};
var ctx = document.getElementById("maderas_Chart");
var LineGraph = new Chart(ctx, {
type: 'line',
data: chartdata,
options: {
responsive: true,
title:{
display:true,
text:'Dique Las Maderas'
},
tooltips: {
mode: 'index',
intersect: false
},
hover: {
mode: 'nearest',
intersect: true
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'Hora'
}
}],
yAxes: [{
display: true,
scaleLabel: {
display: true,
labelString: 'Valor'
}
}]
}
}
});
},
error: function(data) {
console.log(data);
}
});
});
Run Code Online (Sandbox Code Playgroud)
当我第一次配置图表时,可以更改颜色,但是当我添加更多代码时,不能再删除所有代码,而仍然不能更改线条颜色。我正在使用chart.js版本2.7和jquery。
提前致谢...
这是因为,您正在使用不赞成使用的属性(在ChartJS 1.x中使用)来设置颜色。请改用以下属性(适用于ChartJS 2.7):
datasets: [{
label: 'Dique Las Maderas',
fill: false,
borderColor: "#bae755",
borderDash: [5, 5],
backgroundColor: "#e755ba",
pointBackgroundColor: "#55bae7",
pointBorderColor: "#55bae7",
pointHoverBackgroundColor: "#55bae7",
pointHoverBorderColor: "#55bae7",
data: valor
}]
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
6121 次 |
| 最近记录: |