Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Highchart: Background color of Axis

Tags:

highcharts

I saw a similar question here.

In reply its written that we can have background color by making a rectangle.

My question is how I can get x and Y position of all the ticks on axis. I will need it because I want background color only on alternate dates.

Thanks

like image 394
shaaaa Avatar asked Jan 18 '26 20:01

shaaaa


1 Answers

Did you try to use labels.formatter with background and useHTML flag? Something like this: http://jsfiddle.net/AeV7h/

    xAxis: {
        categories: ['Foo', 'Bar', 'Foobar'],

        labels: {
            useHTML: true,
            formatter: function() {
                return '<span class="hc-label">' + this.value + '</span>';
            }
        }
    },

And CSS:

.hc-label {
  background-color: red;
  padding: 0px 5px;
  color: yellow;
}
like image 178
Paweł Fus Avatar answered Jan 20 '26 21:01

Paweł Fus



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!