Javascript 如何在ChartJs中隐藏y轴线？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38593123/
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
How to hide y axis line in ChartJs?
提问by Jaipradeesh
I am using bubble chart and gotta hide the y axis line. I've tried the following but it doesn't work.
我正在使用气泡图并且必须隐藏 y 轴线。我已经尝试了以下但它不起作用。
yAxes: [{
angleLines: {
display: false
}
}]回答by Matt
This disables the vertical Y axis line:
这将禁用垂直 Y 轴线：
options: {
scales: {
yAxes: [{
gridLines: {
drawBorder: false,
},
}]
},
},
This can be combined with displayto disable the vertical gridLines:
这可以与display禁用垂直网格线结合使用：
xAxes: [{
gridLines: {
display: false,
},
}],
Here's a working example: http://codepen.io/anon/pen/xqGGaV
这是一个工作示例：http: //codepen.io/anon/pen/xqGGaV
回答by Daniel
var myBubbleChart = new Chart(ctx,{
type: 'bubble',
data: data,
options: {
scales:
{
yAxes: [{
gridLines : {
display : false
}
}]
}
}
});
回答by Daniel
var ctx = document.getElementById("myChart");
var data = {
datasets: [
{
label: 'First Dataset',
data: [
{ x: 20, y: 30, r: 10 },
{ x: 40, y: 10, r: 10 },
{ x: 30, y: 20, r: 30 }
]
}]
};
var myBubbleChart = new Chart(ctx,{
type: 'bubble',
data: data,
options: {
scales:
{
yAxes: [{
display: false
}]
}
}
});
回答by Tasawar Hussain
so if you only want to hide the grid lines only on the chart , but keep the axis line:
所以如果你只想隐藏图表上的网格线，但保留轴线：
gridLines : {
drawOnChartArea: false
}
With above examples it will be like:
有了上面的例子，它会像：
var myBubbleChart = new Chart(ctx,{
type: 'bubble',
data: data,
options: {
scales:
{
yAxes: [{
gridLines : {
drawOnChartArea: false
}
}]
}
}
});
回答by Adithya Sreyaj
For the latest chart.js (v2.9.3) library: You can do this in chart options to disable a particular axis:
对于最新的 chart.js (v2.9.3) 库：您可以在图表选项中执行此操作以禁用特定轴：
This chart can be obtained like so:
该图表可以这样获得：
scales: {
xAxes: [
{
gridLines: {
display: false,
},
},
],
},
