Chart.js并未显示传说。我使用的是2.4.0版,我在网站上添加了Chart.bundle.min.js
脚本。
定义了lineaRoja
,puntos
,MuPu
等所有变量,数据显示正确。
问题在于Falla balanceada
,Mu y Pu aplicados
和Diagrama M-P
的图例各自的颜色都没有显示出来。当我将鼠标悬停在点上时,只显示工具提示。
var canvas = document.getElementById(domId);
var ctx = canvas.getContext("2d");
var lineChart = new Chart(ctx, {
type: 'line',
data: {
datasets: [{
label: 'Diagrama M-P',
data: puntos
}, {
label: 'Falla balanceada',
backgroundColor: 'rgba(0,0,0,0)',
borderColor: 'rgba(130,0,0,0.6)',
data: [{ x: 0, y: 0}, { x: lineaRoja[0], y: lineaRoja[1] }],
borderDash: [10, 5]
}, {
type: 'scatter',
data: MuPu,
fill: false,
showLine: false,
backgroundColor: 'rgba(0,130,0,0.6)',
label: 'Mu y Pu aplicados',
pointRadius: 6
}]
},
options: {
animation: { duration: 0 },
scales: {
xAxes: [{
type: 'linear',
position: 'bottom',
scaleLabel: {
display: true,
labelString: 'Ton'
}
}],
yAxes: [{
scaleLabel: {
display: true,
labelString: 'Ton m'
},
ticks: {
min: 0,
beginAtZero: true
}
}]
}
}
});
答案 0 :(得分:2)
解决了,我正在使用的Bootstrap模板在其.js
中的某个地方有这个代码Chart.defaults.global.legend = {
enabled: false
};
答案 1 :(得分:2)
您可以在选项中添加此内容。
legend: {
display: true
}
答案 2 :(得分:0)
要在图表上显示图例标签,请将其添加到您的配置中。
legend: {
display: true
}