我试着让勾号变成红色。但它不起作用。当标签没有标签- Sa/Su时它起作用。所有标签-灰色,但当我有Su或Sa标签时,它只是黑色
ticks: {
fontSize: 9,
fontColor: curLabels.map((item) => {
if(item === 'Su' || item === 'Sa')
return 'red';
return 'rgba(0, 0, 0, 0.4)';
}),
maxRotation: 0,
},
编辑:
<div style={{height: '100%'}} className='position-relative'>
<Line
key='lineChart17'
data={dataForChart}
options={lineOptions}
style={{height: '90px', padding: '5px', width: '100%'}}
redraw
/>
</div>
图表的选项。我得到错误- ticks没有属性major。在控制台中它只有字符串- Mo/Th/Fr/We/Su...:
const lineOptions = {
animation: {
duration: 0
},
layout:{
padding:{
left: 0,
right: 0,
top: 5,
bottom: 0
}
},
maintainAspectRatio: false,
scales: {
xAxes: [{
display: true,
gridLines: {
display: true,
tickMarkLength: 1,
},
ticks: {
fontSize: 9,
fontColor: 'rgba(0, 0, 0, 0.4)',
maxRotation: 0,
major: {
enabled: true,
fontStyle: 'bold',
fontColor: 'red'
},
},
afterBuildTicks: (scale, ticks) => {
ticks.forEach(t => {
t.major = (t === 'Su');
});
return ticks;
},
}],
yAxes: [{
display: false,
gridLines: {
display: false,
tickMarkLength: 1,
},
}],
},
};
1条答案
按热度按时间bejyjqdl1#
根据Chart.js文档,选项
ticks.fontColor
不接受array
,而接受简单的string
。但是,您可以通过
ticks.major
配置定义周末ticks
的风格,如下所示。此外,您还需要通过
afterBuildTicks
回调将所需的分笔成交点标记为major
。请看一下下面的可运行代码片段。
第一个