Javascript 在 Chart.js 中隐藏 y 轴上的标签
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28716464/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hiding labels on y axis in Chart.js
提问by Supriya Kale
回答by Gene Parcellano
To hide just the labels, in the latest version (2.3.0) of Charts.js, you disable tickslike so:
要仅隐藏标签，在 Charts.js 的最新版本 (2.3.0) 中，您可以ticks像这样禁用：
options: {
scales: {
yAxes: [{
ticks: {
display: false
}
}]
}
}
回答by kehers
For version 2, you can do this with the Scalesoption in the global configuration.
对于版本 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]
}]
}
});
回答by Alex
This will hide labels in Y-Axis: (but not X-Axis)
这将隐藏 Y 轴中的标签：（但不是 X 轴）
scaleShowLabels: false,
回答by Anton Grigoryev
Solved it with overriding y-axis labels width
用覆盖 y 轴标签宽度解决了这个问题
Chart.Scale.prototype.buildYLabels = function () {
this.yLabelWidth = 0;
};
回答by mQuiroz
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
}
}]
}
}
回答by memo
Chart.defaults.scale.ticks.display = false;
回答by Charitha Goonewardena
try this one
试试这个
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);
回答by Jannunen
This worked for me with Chartjs v2.4.0
这对我有用 Chartjs v2.4.0
The idea is to set backDropColor to full transparent. 255,255,255 is white, but 0 sets it to transparent.
这个想法是将 backDropColor 设置为完全透明。255,255,255 是白色，但 0 将其设置为透明。
Then the userCallback returns always an emptry string.
然后 userCallback 总是返回一个空字符串。
The end result is hidden y-axis labels.
最终结果是隐藏的 y 轴标签。
ticks: {
backdropColor : "rgba(255,255,255,0)",
userCallback: function(value, index, values) {
return "";
}
}
回答by Tune389
you can use the scaleShowLabels option
您可以使用 scaleShowLabels 选项
