It seems like this should be simple, but I cannot figure it out and nothing in the API documentation seems to be working. I want to change the color of a single column when that column is hovered.

I have tried setting each point in the data to have a hover state with colorFill, but to no avail, i have also tried setting it in plotOptions in the column attribute

Here is a little something to help: /

Tried this: .data.marker.states.hover.fillColor
Tried this: .column.states.hover.marker.fillColor
Both did not work. Not sure what else to do.

I found this: Highcharts: changing color on hover ranking chart but it changes the whole series, not just the current point/column.

It seems like this should be simple, but I cannot figure it out and nothing in the API documentation seems to be working. I want to change the color of a single column when that column is hovered.

I have tried setting each point in the data to have a hover state with colorFill, but to no avail, i have also tried setting it in plotOptions in the column attribute

Here is a little something to help: http://jsfiddle.net/TheSharpieOne/DMcQ3/

Tried this: http://api.highcharts.com/highcharts#series.data.marker.states.hover.fillColor
Tried this: http://api.highcharts.com/highcharts#plotOptions.column.states.hover.marker.fillColor
Both did not work. Not sure what else to do.

I found this: Highcharts: changing color on hover ranking chart but it changes the whole series, not just the current point/column.

• javascript
• jquery
• highcharts

1 Answer 1

You were almost there, but you want to set color and not fillColor (and not on the marker)-- I added this to the chart declaration:

plotOptions: {
    column: {
        states: {
            hover: {
                color: '#000000'                                                           
            }
        }
    }
}

And removed the states stuff from the column data, that seems to work in this fiddle.

And, yes, that's not very clear in the documentation ...