I am trying to hide the axis and gridlines of my Highcharts chart entirely. So far I have tried to set the width of the lines to 0, but it didn't work out.
xAxis: {
lineWidth: 0,
minorGridLineWidth: 0,
lineColor: 'transparent'
}
Is it possible to just globally disable the axis lines/ticks and gridlines to create a "plain" plot?
This question is related to
charts
highcharts
Just add
xAxis: {
...
lineWidth: 0,
minorGridLineWidth: 0,
lineColor: 'transparent',
...
labels: {
enabled: false
},
minorTickLength: 0,
tickLength: 0
}
to the xAxis definition.
Since Version 4.1.9 you can simply use the axis attribute visible:
xAxis: {
visible: false,
}
For the yAxis you'll also need:
gridLineColor: 'transparent',
If you doesn't want to touch the config object, you just hide the grid by css:
.chart-container .highcharts-grid {
display: none;
}
you can also hide the gridline on yAxis as:
yAxis:{
gridLineWidth: 0,
minorGridLineWidth: 0
}
If you have bigger version than v4.9 of Highcharts you can use visible: false in the xAxis and yAxis settings.
Example:
$('#container').highcharts({
chart: {
type: 'column'
},
title: {
text: 'Highcharts axis visibility'
},
xAxis: {
visible: false
},
yAxis: {
title: {
text: 'Fruit'
},
visible: false
}
});
i managed to turn off mine with just
lineColor: 'transparent',
tickLength: 0
This has always worked well for me:
yAxes: [{
ticks: {
display: false;
},
Source: Stackoverflow.com