Accepted answer


in the latests versions (v4 at least) in renderer api methods usehtml argument was added, for example renderer.text(str, x, y, usehtml) - which will render elements as html and position them correctly. of course simple shapes (rect, path etc.) are always rendered in svg/vml.

extra note: for html elements, to see them on exported chart, don't forget to set exporting.allowhtml.

old answer:

renderer is to render elements on svg/vml. if you want to add html tags, add them the same way as is done in highcharts - position:absolute and set left/top values to put this inside container.


you can refer in this website .

hope it will help.


you will have to use highcharts renderer api.

you can refer this jsfiddle working demo

it works like:

var chart = new highcharts.chart({
}, function(chart) { // on complete

    chart.renderer.text('this text is <span style="color: red">styled</span> and <a href="">linked</a>', 150, 80)
            color: '#4572a7',
            fontsize: '16px'


Related Query

More Query from same tag