我的圖表中有 12 個月。我需要加粗當前月份的標簽。示例：這個月是四月。所以我需要給 April 加粗標簽。我已經搜索了如何加粗，但它會影響所有標簽。
這是我的代碼：
var lineChart = new Chart(ctx, {
type: 'line',
data: {
labels: label,
datasets: [{
label: "Visitors",
backgroundColor: "transparent",
borderColor: "rgba(38, 185, 154, 0.7)",
tension: 0,
data: value
}]
},
options: {
scale: {
pointLabels: {
fontStyle: "bold",
},
}
}
});
uj5u.com熱心網友回復：
您可以ticks.font在 x 軸上定義一種array字體，如下所示：
scales: {
x: {
ticks: {
font: labels.map(l => ({ weight: l == 'April' ? 'bold' : 'normal' }))
}
}
}
請看下面的可運行示例代碼，看看它是如何作業的。請注意，在此代碼中，我更改了字體weight和size所需月份。
const labels = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
const data = [91, 85, 70, 96, 70, 81, 85, 66, 47, 26, 7, 4];
new Chart('myChart', {
type: 'line',
data: {
labels: labels,
datasets: [{
label: "Visitors",
backgroundColor: "transparent",
borderColor: "rgba(38, 185, 154, 0.7)",
tension: 0,
data: data
}]
},
options: {
scales: {
x: {
ticks: {
font: labels.map(l => ({
size: l == 'April' ? 14 : 12,
weight: l == 'April' ? 'bold' : 'normal'
}))
}
}
}
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>
<canvas id="myChart" height="90"></canvas>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/456529.html
標籤：asp.net-mvc 图表.js