CODEWITHSUNDEEP
javascriptnode.jshighcharts
Vish
Vish

Reputation: 142

Can we add negative color in highcharts stockchart based on a variable other that data?

Can we add negative color in highcharts based on a variable other that data? Since, the data I have are all positive values but I need to show the chart in red based on a variable which will be negative.

series: [{
            type: 'area',
            data: [-12,24,54,-9,-12],
            visible: false,
            gapSize: 0,
            tooltip: {
                valueDecimals: 2
            },
            marker: {
                enabled: false,
                symbol: 'circle',
                radius: 4,
                lineWidth: 0,
                states: {
                    hover: {
                        fillColor: '#58aa00',
                    }
                },
            },
            lineColor: '#58aa00',
            negativeColor: 'red',
            fillColor: {
                linearGradient: {
                    x1: 0,
                    y1: 0,
                    x2: 0,
                    y2: 1,
                },
                stops: [
                    [0, '#c6e1b2'],
                    [1, Highcharts.color('#eaf4e2')
                        .setOpacity(0)
                        .get("rgba"),
                    ],
                ],
            }

Now from the above code I will get the negative color wherever there is a negative value, but I want to make the chart red based on a different value, say I have a variable x = -20 which is not present in the data array.

Any help would be appreciated. Thanks in advance.

Upvotes: 0

Views: 50

Answers (1)

Sebastian Wędzel
Sebastian Wędzel

Reputation: 11633

The negative value is taken from the threshold value, so you can easily define/change it.

Demo: https://jsfiddle.net/BlackLabel/t9zhuakp/

API: https://api.highcharts.com/highcharts/plotOptions.series.threshold

Upvotes: 1

Related Questions