shifu
shifu

Reputation: 670

Add Gradient color on Plotband highchart

I am creating a line chart on highchart. Is there a way to make the plotBands to have a gradient color?

        plotBands: [{
        from: 7,
        to: 0,
        color: 'rgba(255, 51, 51, 0.28)'
    }]

Here you can check my code for your reference http://jsfiddle.net/MyTestSampleAccount/0nqn5vzs/

Upvotes: 2

Views: 1270

Answers (1)

AliRıza Adıyahşi
AliRıza Adıyahşi

Reputation: 15866

You can use something like following:

yAxis: {
    ...,
    plotBands: [{
        color: {
            linearGradient: { x1: 1, y1: 1, x2: 1, y2: 0 },
            stops: [
                [0, 'rgb(255, 255, 255)'],
                [1, 'rgb(200, 200, 255)']
            ]
        },
        from: 0,
        to: 7
    }],
},

DEMO

Upvotes: 4

Related Questions