删除 chart.js 中的 x 轴标签/文本 [英] Remove x-axis label/text in chart.js
本文介绍了删除 chart.js 中的 x 轴标签/文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何隐藏chart.js中显示的x轴标签/文本?
How do I hide the x-axis label/text that is displayed in chart.js ?
设置 scaleShowLabels:false
只会删除 y 轴标签.
Setting scaleShowLabels:false
only removes the y-axis labels.
<script>
var options = {
scaleFontColor: "#fa0",
datasetStrokeWidth: 1,
scaleShowLabels : false,
animation : false,
bezierCurve : true,
scaleStartValue: 0,
};
var lineChartData = {
labels : ["1","2","3","4","5","6","7"],
datasets : [
{
fillColor : "rgba(151,187,205,0.5)",
strokeColor : "rgba(151,187,205,1)",
pointColor : "rgba(151,187,205,1)",
pointStrokeColor : "#fff",
data : [1,3,0,0,6,2,10]
}
]
}
var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Line(lineChartData,options);
</script>
推荐答案
UPDATE chart.js 2.1 及更高版本
var chart = new Chart(ctx, {
...
options:{
scales:{
xAxes: [{
display: false //this will remove all the x-axis grid lines
}]
}
}
});
var chart = new Chart(ctx, {
...
options: {
scales: {
xAxes: [{
ticks: {
display: false //this will remove only the label
}
}]
}
}
});
旧答案(在当前版本为 1.0 beta 时编写)仅供参考:
为了避免在 chart.js
中显示标签,您必须设置 scaleShowLabels : false
并避免传递 labels
:
To avoid displaying labels in chart.js
you have to set scaleShowLabels : false
and also avoid to pass the labels
:
<script>
var options = {
...
scaleShowLabels : false
};
var lineChartData = {
//COMMENT THIS LINE TO AVOID DISPLAYING THE LABELS
//labels : ["1","2","3","4","5","6","7"],
...
}
...
</script>
这篇关于删除 chart.js 中的 x 轴标签/文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文