我有一个基于模型设计的图表,但是模型图表使用了图例 pointStyles 的自定义图标,基本上我在图表 JS 本身中找不到它们,我尝试了不同类别的 pointStyle,例如('rect' , 'clearRect') 但它们都有不同的样式。所以基本上我的问题是我们如何为图表pointStyle提供自定义图标/设计。
样机图:
我的图表:
我的图表 JS:
new Chart(document.getElementById("report-chart"), {
type: 'line',
data: {
labels: chartData.label,
datasets: [{
label: 'FMV INSTALLED',
data: chartData.data.fmvI,
borderColor: "#69bd45",
fill: false,
borderWidth: 2,
pointStyle: 'clearRect'
}, {
label: 'EXCHANGE',
data: chartData.data.fmv,
borderColor: "#f18e35",
borderDash: [2, 2],
fill: false,
pointStyle: 'rect'
}, {
label: 'ORDERLY',
data: chartData.data.olv,
borderColor: "#a62061",
fill: false,
// borderWidth: 20,
}, {
label: 'FORCED',
data: chartData.data.flv,
borderColor: "#64cdf3",
fill: false,
borderWidth: 1,
}]
},
options: {
scales: {
yAxes: [{
ticks: {
// Include a dollar sign in the ticks
callback: function(value, index, values) {
return '$' + value;
}
}
}],
xAxes: [{
position: 'top'
}]
},
legend: {
display: true,
position: 'bottom',
labels: {
useLineStyle: true,
usePointStyle: true
}
},
}
});

