我正在使用气泡图,必须隐藏y轴线。我已经尝试了以下,但它不工作。
yAxes: [{ angleLines: { display: false }}]
yAxes: [{
angleLines: {
display: false
}
}]
hgc7kmma1#
这将禁用垂直Y轴线:
options: { scales: { yAxes: [{ gridLines: { drawBorder: false, }, }] },},
options: {
scales: {
gridLines: {
drawBorder: false,
},
这可以与display结合使用,以禁用垂直网格线:
display
xAxes: [{ gridLines: { display: false, },}],
xAxes: [{
display: false,
}],
下面是一个工作示例:http://codepen.io/anon/pen/xqGGaV
bq9c1y662#
从版本3开始,您应该使用此选项来完全隐藏轴:图片:chartjs-without-axes
scales: { x: { display: false, }, y: { display: false, }},
x: {
y: {
更新日期:
如果您只想隐藏线条(并保留刻度),请将display: false config移动到“grid”参数,如下所示:
scales: { y: { grid: { display: false } }}
grid: {
fafcakar3#
对于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 barChart = new Chart(ctx,{
type: 'bar',
data: data,
scales:
{
drawBorder: false, // <-- this removes y-axis line
lineWidth: 0.5,
});
xdnvmnnf4#
var myBubbleChart = new Chart(ctx,{ type: 'bubble', data: data, options: { scales: { yAxes: [{ gridLines : { display : false } }] } }});
var myBubbleChart = new Chart(ctx,{
type: 'bubble',
gridLines : {
display : false
kulphzqa5#
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 }] } }});
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 }
]
};
bmp9r5qi6#
因此,如果您只想隐藏图表上的网格线,但保留轴线:
gridLines : { drawOnChartArea: false}
drawOnChartArea: false
上面的例子就像这样:
var myBubbleChart = new Chart(ctx,{ type: 'bubble', data: data, options: { scales: { yAxes: [{ gridLines : { drawOnChartArea: false } }] } }});
nfg76nw07#
我用这个:
scales: { xAxes: [{ display: false, }], yAxes: [{ display: false, }]}
wooyq4lh8#
这样放置选项配置
options: { legend: { display: false }, title: { display: true, text: title+` (${data.reduce((a,b)=>a+b,0)})` } , scales: { yAxes: [{ display: false, }] } }
legend: {
title: {
display: true,
text: title+` (${data.reduce((a,b)=>a+b,0)})`
,
1rhkuytd9#
对于最新的chart.js(v2.9.3)库:您可以在图表选项中执行此操作,以禁用特定轴:
此图表可通过以下方式获得:
scales: { xAxes: [ { gridLines: { display: false, }, }, ], },
xAxes: [
],
9条答案
按热度按时间hgc7kmma1#
这将禁用垂直Y轴线:
这可以与
display
结合使用,以禁用垂直网格线:下面是一个工作示例:http://codepen.io/anon/pen/xqGGaV
bq9c1y662#
从版本3开始,您应该使用此选项来完全隐藏轴:
图片:chartjs-without-axes
更新日期:
如果您只想隐藏线条(并保留刻度),请将
display: false
config移动到“grid”参数,如下所示:fafcakar3#
对于Chartjs版本3.3.2,这对我有效
xdnvmnnf4#
kulphzqa5#
bmp9r5qi6#
因此,如果您只想隐藏图表上的网格线,但保留轴线:
上面的例子就像这样:
nfg76nw07#
我用这个:
wooyq4lh8#
这样放置选项配置
1rhkuytd9#
对于最新的chart.js(v2.9.3)库:您可以在图表选项中执行此操作,以禁用特定轴:
此图表可通过以下方式获得: