score:1

Accepted answer

From docs:

HTML in Highcharts

Texts and labels in Highcharts are given in HTML, but as the HTML is parsed and rendered in SVG, only a subset is supported. The following tags are supported: <b>, <strong>, <i>, <em>, <br/>, <span>. Spans can be styled with a style attribute, but only text-related CSS that is shared with SVG is handled.

Most places where text is handled in Highcharts, it is also followed by an option called useHTML. When this is true, the text is laid out as HTML on top of the chart. This allows for full HTML support and can be a good idea if you want to add images in your labels, tables in your tooltip etc.

So, you can use HTML tags in categories array, for example:

  xAxis: {
    ...,
    categories: [
      '<span style="font-size: 16px; color: red;">-22.5%</span><br>CLIENT<br>CALLS',
      ...
    ]
  }

Live demo: http://jsfiddle.net/BlackLabel/kLu7rtea/

Docs: https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting

API Reference:

https://api.highcharts.com/highcharts/xAxis.categories

https://api.highcharts.com/highcharts/xAxis.labels.useHTML


Related Articles