显示Highcharts气泡图的其他文本

Question

嗯...我知道如何在highcharts气泡图中的每个气泡上显示自定义文字，但是可以在气泡上方或外部显示其他文字（如下图所示）？

对于那些需要知道如何在气泡上显示自定义文字的人，以下是图表选项所需的选项：（view the full code）

        plotOptions: {
        series: {
            dataLabels: {
                enabled: true,
                useHTML:true,
                formatter:function(){
                    return "<span style='position:relative;top:-10px;'>"+this.y + "$</span>";
                }
            }
        }

Answer 1

无论如何，我找到了解决方案。我使用this.point.shapeArgs.r来获取格式化函数中每个气泡的半径。 这是功能：

formatter:function(){
                    return "<div class='labeltext'><span style='position :relative;top:-"+this.point.shapeArgs.r+"px;display:block'>Group #</span><span style='position:relative;top:-10px;text-align:center;'>"+this.y+"$</span></div>";
                }

完整更新的示例是here

<强>更新 要解决“正在裁剪的数据标签”问题，请查看this updated version

Answer 2

据我所知，从文档中可以看出 http://api.highcharts.com/highcharts#plotOptions.bubble.dataLabels 每个值只能有一个标签。

但我看到两个选择：

1. 使用渲染器http://api.highcharts.com/highcharts#Renderer
添加文字

2. 使用变通方法设置标签文本的一部分的位置

     formatter:function(){
                   return "<span>"+this.y + "$</span> <span style='position:relative;top:-"+this.point.z/3)+"px;'>FOO "+this.point.z+"</span>";
               }, 
   

请参阅http://jsfiddle.net/t7yYn/5/

用

this.point.z

你得到泡泡的价值。

在飞行中我没有找到缩放比例。您可以通过试验和错误找到该值（取决于您的气泡的minSize，maxSize和图表尺寸），或者您找到 如何从高中获得它。 （让我知道怎么做！; - ）

希望有所帮助。