在 highcharts 标签中添加图像

Question

我正在尝试绘制 Highchart 并将图像和文本放在切片上。但是不知何故 SVG 图像没有显示。

下面是Fiddlelink

我用来在 Series 对象中显示图像的一些代码是

formatter : function(){
            return '<svg class="icon">
                    <circle cx="10" cy="10" r="10" fill="red"  /></svg> 7 
                    %'  ; 
},

Answer 1

Highchart 的默认渲染使用 SVG 文本节点，它只渲染文本。您需要强制标签使用 HTML:

dataLabels:{
    useHTML: true,
    formatter : function(){
         return '<svg class="icon"><circle cx="10" cy="10" r="10" fill="red"  /></svg> 7 %'  ; 
    },
}

请注意，这会导致一些非常古怪的渲染，因此您需要相应地调整 CSS。

在 highcharts 标签中添加图像

Add image in highcharts labels

javascript

jquery

svg

highcharts