sbaskar1
Posts: 4
Joined: Wed Aug 17, 2022 1:06 pm

Line in Line chart not visible when the line values are 0 over the x axis when both have the same width

Hi,

We are using the licensed version of Highcharts. We encountered a problem where the line in Line chart not visible when the line values are 0, if xaxis and line have the same 'width'. We want the line to overlap the x axis instead of x axis overlapping the line. Is there a way to do this?

eg:
Highcharts.chart('container', {
xAxis: {
plotLines: [{
color: 'red',
width: 2,
value: Date.UTC(2010, 0, 4),
zIndex: 5
}],
tickInterval: 24 * 3600 * 1000, // one day
type: 'datetime',
lineWidth: 2,
lineColor: '#ccc'
},

series: [{
data: [0, 0, 0, 0, 144.0, 176.0, 135.6, 148.5, 216.4],
pointInterval: 24 * 3600 * 1000,
width: 2
}]
});

PS: We don't want to insert 'dots' or symbols in line line of line chart to make the points alone visible over x axis. We also tried using zIndex property but it did not work.

Thanks,
Saranya
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: Line in Line chart not visible when the line values are 0 over the x axis when both have the same width

Hi there Saranya!

The line is not hidden under the xAxis (therefore zIndex didn't work), but it's clipped.
Setting the series.clip to false resolves the issue right away.

DEMO: https://jsfiddle.net/BlackLabel/xtpwv68s/
API Reference: https://api.highcharts.com/highcharts/p ... eries.clip

In case of any other questions, please do not hesitate to contact us,
Best regards!
Kamil Musiałowski
Highcharts Developer

Return to “Highcharts Usage”