Highcharts：如何在图表区域内添加HTML

Question

是否可以在图表区域内添加自定义HTML（例如div）（在边框内部; Highcharts Renderer似乎不提供此选项）？如果是的话怎么会这样做呢？

感谢任何帮助。

Answer 1

您必须使用 Highcharts Renderer API 。

您可以参考此JSFIDDLE working demo

它的工作原理如下：

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

    chart.renderer.text('This text is <span style="color: red">styled</span> and <a href="http://example.com">linked</a>', 150, 80)
        .css({
            color: '#4572A7',
            fontSize: '16px'
        })
        .add();

});

Answer 2

修改

在Renderer API方法的useHTML方法renderer.text(str, x, y, useHTML)中添加了exporting.allowHTML个参数中的最后版本（至少v4） - 这会将元素呈现为HTML并正确定位它们。当然，简单的形状（rect，path等）总是以SVG / VML呈现。

额外注意：对于HTML元素，要在导出的图表上查看它们，请不要忘记设置{{3}}。

旧回答：

渲染器是在SVG / VML上渲染元素。如果要添加HTML标记，请按照与Highcharts相同的方式添加它们 - position：absolute和set left / top values将其放入容器中。

Answer 3

您可以在本网站上查阅。 http://pmsipilot.github.io/jquery-highchartTable-plugin/#demo

希望它会有所帮助。