Javascript 如何在ChartJs中隐藏y轴线?
我在用气泡图,必须隐藏y轴。我试过以下方法,但不起作用Javascript 如何在ChartJs中隐藏y轴线?,javascript,charts,chart.js,Javascript,Charts,Chart.js,我在用气泡图,必须隐藏y轴。我试过以下方法,但不起作用 yax:[{ 斜线:{ 显示:假 } }]这将禁用垂直Y轴线: options: { scales: { yAxes: [{ gridLines: { drawBorder: false, }, }] }, }, gridLines : { drawOnChartArea: false } 这可以与显示结合使用,以禁用垂直网格线: xAxes: [{ grid
yax:[{
斜线:{
显示:假
}
}]
这将禁用垂直Y轴线:
options: {
scales: {
yAxes: [{
gridLines: {
drawBorder: false,
},
}]
},
},
gridLines : {
drawOnChartArea: false
}
这可以与显示结合使用,以禁用垂直网格线:
xAxes: [{
gridLines: {
display: false,
},
}],
下面是一个工作示例:因此,如果您只想在图表上隐藏网格线,但保留轴线:
options: {
scales: {
yAxes: [{
gridLines: {
drawBorder: false,
},
}]
},
},
gridLines : {
drawOnChartArea: false
}
通过以上示例,它将类似于:
var myBubbleChart = new Chart(ctx,{
type: 'bubble',
data: data,
options: {
scales:
{
yAxes: [{
gridLines : {
drawOnChartArea: false
}
}]
}
}
});
对于最新的chart.js(v2.9.3)库:
可以在“图表选项”中执行此操作以禁用特定轴:
此图表可按如下方式获得:
比例:{
xAxes:[
{
网格线:{
显示:假,
},
},
],
},
我用这个:
scales: {
xAxes: [{
display: false,
}],
yAxes: [{
display: false,
}]
}
把你的选项像这样配置
选项:{
图例:{
显示:假
},
标题:{
显示:对,
text:title+`(${data.reduce((a,b)=>a+b,0)})`
}
,
比例:{
雅克斯:[{
显示:假,
}]
}
}
从版本3开始,应使用此选项完全隐藏轴:
图片:
对于Chartjs 3.3.2版,这对我很有用
var barChart = new Chart(ctx,{
type: 'bar',
data: data,
options: {
scales:
{
y: {
grid: {
drawBorder: false, // <-- this removes y-axis line
lineWidth: 0.5,
}
}
}
}
});
var条形图=新图表(ctx{
类型:'bar',
数据:数据,
选项:{
规模:
{
y:{
网格:{
drawBorder:false,//你能显示你正在使用的完整代码吗?最好是在fiddle中。Jaipradesh,你能不能更改接受的答案,以便首先显示正确的答案?这会隐藏轴本身。我需要记号,但不是线。谢谢!我还想补充一点,如果你想隐藏关于x轴的所有信息,请使用记号:{display:false},网格线:{display:false,drawBorder:false}}]用于xAxes键。同样适用于yAses,当然这也是违反直觉的。我希望在对象中添加display:false
以隐藏所有内容。这对我来说很有效(2.9.4),以前的答案似乎适用于旧版本。完美。效果很好!!
var barChart = new Chart(ctx,{
type: 'bar',
data: data,
options: {
scales:
{
y: {
grid: {
drawBorder: false, // <-- this removes y-axis line
lineWidth: 0.5,
}
}
}
}
});