[英]How to remove the Chart.js x Axis bottom line?
我正在使用 Chart.js 2.8.0 试图摆脱 X/Y 轴边界。 使用gridLines { showBorder: false }}
我仍然看到 X 轴边框。 我还将颜色设置为 0 alpha,X 和 Y 上的所有其他线都消失了,除了 X 轴上的底部线不会消失 go。 尝试一些其他选项,如drawBorder: false
和scaleLineColor: "rgba(0,0,0,0)",
没有影响 X 轴上的底线。
这是我的图表配置
type: 'line',
data: {
datasets: [{
label: '',
data: [],
backgroundColor: [],
borderWidth: 1
}]
},
options: {
scaleLineColor: "rgba(0,0,0,0)",
layout: {
padding: {
top: 20
}
},
legend: {
display: false
},
scales: {
gridLines: {
showBorder: false
},
xAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
}
}],
yAxes: [{
gridLines: {
color: "rgba(0, 0, 0, 0)",
},
ticks: {
beginAtZero: true,
display: false,
}
}]
}
}
};
如果有人在 v3 上寻找答案,它的options.scales.x.grid.drawBorder: false
这是在 v3.7.1 上通过查看 typescript 文件并尝试任何看起来相关的东西完全偶然发现的。
经过一段时间的摆弄之后,我发现解决方案zeroLineColor:“透明”可以解决问题。 在这里找到它https://github.com/chartjs/Chart.js/issues/3950
scales: {
xAxes: [{
gridLines: {
zeroLineColor: 'transparent'
},
}],
对于任何在 v5 中寻找答案的人来说,它是: options.scales.x.border.display: false;
这个答案是谁在使用 recharts 模块:
<XAxis strokeOpacity={0} dataKey="name" />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.