CODEWITHSUNDEEP
javascriptjqueryhtmlcsshighcharts
CodingFriend
CodingFriend

Reputation: 149

How would I fill MAX MIN bullets in highcharts?

I want to fill the bullets of highcharts just like the bar of the highchart. Please help me if anyone has knowledge of highcharts. This is highchart function which I am using. I want to make the first colour as the first bar as the second color as the second bar. If you know any solution then please let me know. Thank you

var chart = new Highcharts.Chart({
            chart: {
                renderTo:'DimensionsChartfirst',
                type:'column'
            },
            colors: ['#0070C0', '#C00000'],
           title: {
                text: 'Office data'
            },
            subtitle: {
                text: ''
            },
            credits:{enabled:false},
            legend:{
            },
            plotOptions: {
                series: {
                    shadow:false,
                    borderWidth:0
                }
            },
            xAxis:{
            categories: [
                    'Weight',
                    'Height'
                ],
                lineColor:'#999',
                lineWidth:1,
                tickColor:'#666',
                tickLength:3,
                title:{
                    text:'Part Counts'
                }
            },
            yAxis:{
                lineColor:'#999',
                lineWidth:1,
                tickColor:'#666',
                tickWidth:1,
                tickLength:3,
                gridLineColor:'#ddd',
                title:{
                    text:'Office data',
                   // rotation:90,
                    margin:10
                }
            },    
            series: [{
                        name: 'MAX',
                data: MaxVal,
                colors: ['#0070C0'],
                type: 'column',
                colorByPoint: true
            },{
                        name: 'MIN',
                data: MinVal,
                colors: ['#C00000'],
                type: 'column',
            colorByPoint: true
            }]

        });

How would I fill these MAX MIN bullets in highcharts

Upvotes: 0

Views: 154

Answers (2)

raf18seb
raf18seb

Reputation: 2146

You just need to remove colorByPoint: true properties in your series.

jsFiddle: https://jsfiddle.net/4zu28aqk/

API Reference: https://api.highcharts.com/highcharts/series.column.colorByPoint

Upvotes: 5

CodingFriend
CodingFriend

Reputation: 149

series: [{
                name: 'MAX',
                data: MaxVal,
                color: '#0070C0'

            },{
                name: 'MIN',
                data: MinVal,
                color: '#C00000'

            }]

Upvotes: -1

Related Questions