[英]Hiding labels on y axis in Chart.js
为了只隐藏标签,在 Charts.js 的 2.3.0 版中,您可以像这样禁用ticks
:
options: {
scales: {
yAxes: [{
ticks: {
display: false
}
}]
}
}
对于版本 2,您可以使用全局配置中的Scales选项执行此操作。
var ctx = document.getElementById("log");
var chart = new Chart(ctx, {
type: 'line',
options: {
scales: {
xAxes: [{
display: false
}],
yAxes: [{
display: false
}],
}
},
data: {
labels: ['Item 1', 'Item 2', 'Item 3'],
datasets: [{
fill: false,
borderWidth: 1,
data: [10, 20, 30]
}]
}
});
对于版本 3.x
options: {
scales: {
y: {
ticks: {
display: false,
}
}
}
}
这将隐藏 y 标签。
这将隐藏 Y 轴中的标签:(但不是 X 轴)
scaleShowLabels: false,
options: {
scales: {
yAxes: [{
gridLines: {
display: true,
color: 'rgba(219,219,219,0.3)',
zeroLineColor: 'rgba(219,219,219,0.3)',
drawBorder: false, // <---
lineWidth: 27,
zeroLineWidth: 1
},
ticks: {
beginAtZero: true,
display: true
}
}]
}
}
Chart.defaults.scale.ticks.display = false;
用覆盖 y 轴标签宽度解决了这个问题
Chart.Scale.prototype.buildYLabels = function () {
this.yLabelWidth = 0;
};
试试这个
var statDat = {
labels: ["January", "February", "March", "April", "May", "June"],
datasets: [
{
fillColor: "rgba(255, 152, 0, 0.30)",
strokeColor: "#f26b5f",
pointColor: "#f26b5f",
pointBackgroundColor: "rgba(179,181,198,1)",
pointBorderColor: "#00fff5",
pointStrokeColor: "#f26b5f",
data: [203, 156, 99, 251, 305, 247]
}
]
};
var stats = document.getElementById('stats').getContext('2d');
var options = {
scaleShowLabels: false
};
new Chart(stats).Line(statDat, options);
这对我有用 Chartjs v2.4.0
这个想法是将 backDropColor 设置为完全透明。 255,255,255 是白色,但 0 将其设置为透明。
然后 userCallback 总是返回一个空字符串。
最终结果是隐藏的 y 轴标签。
ticks: {
backdropColor : "rgba(255,255,255,0)",
userCallback: function(value, index, values) {
return "";
}
}
如果您使用 3.3.2 Y 轴将被隐藏:
options:
{
scales: {
yAxis: {
display: false,
}
}
},
我需要在使用库chart.js绘制的折线图中隐藏标签。 我用谷歌搜索,但没有运气。 可以隐藏吗?
谢谢
options: {
scales: {
yAxes: [{
ticks: {
display: false
}
}]
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.