CODEWITHSUNDEEP
highcharts
davidcoder
davidcoder

Reputation: 938

Highcharts hide connected line between individual points

I'm using Line chart to plot my data by using Highchart 4.0.3 library.

I would like to know if there's any way to remove a connected line between 2 individual points or set its color to transparent ?

I only can find the option to set the color for the whole series line.

I really appreciate for your time and help.

Upvotes: 4

Views: 5143

Answers (2)

Adam Marsh
Adam Marsh

Reputation: 1156

This is really old, but I stumbled upon this in 2021. My solution/hack is to add a null value data-set in the series between the points you do not want a line.

Note: plotOptions.series.connectNulls defaults to false, so a line is not drawn. An example series:

const series = {
        type: 'line',
        lineWidth: 1,
        color:'#00ff00',
        dashStyle: 'Solid',
        marker: {
            symbol: 'circle',
            enabled: true
        },
        name: `my series`,
        data: [
        {
            y: 10
            x: Date.now() - 86400000
        },
        
        {
            y: 10,
            x: Date.now(),
            color: 'red'
        },
        {
            y: null,
            x: null,
        },
        {
            y: 7,
            x: Date.now() - 86400000,
            color: 'red'
        },
        {
            y: 7,
            x: Date.now()
        },
        ]
    }

I just had a simple use case - plotting thresholds on a chart.

Upvotes: 1

ronenfe
ronenfe

Reputation: 2405

I found a better solution: lineWidth : 0 Worked for me.

http://api.highcharts.com/highcharts#plotOptions.series.lineWidth

Upvotes: 4

Related Questions