반응형
chart.js로 색상 선을 변경할 수 없습니다.
저는 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);
}
});
});
차트를 처음 구성할 때 색상을 변경할 수 있지만 코드를 더 추가할 때는 모든 코드를 삭제하고 여전히 라인 색상을 변경할 수 없습니다.저는 chart.js version 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
}]
언급URL : https://stackoverflow.com/questions/46301481/cant-change-color-line-with-chart-js
반응형
'programing' 카테고리의 다른 글
CDN이 실패한 경우 로컬 스타일시트(스크립트가 아닌)로 폴백하는 방법 (0) | 2023.09.24 |
---|---|
Gmail과 NodeJS가 있는 이메일러 없음 (0) | 2023.09.24 |
젠드 프레임워크 2에서 렌더 뷰를 비활성화하는 방법? (0) | 2023.09.24 |
gcc는 리눅스 ELF에 어떤 기능을 추가합니까? (0) | 2023.09.24 |
오라클 프로시저에서 서버 출력 설정 (0) | 2023.09.24 |