高图表响应数据标签显示 [英] highcharts responsive datalabels display

问题描述

有什么方法可以将高图表的dataLabel设置为在较小尺寸时不重叠?

Is there any way to set the dataLabels of the highcharts to not overlap for smaller sizes?

我有一张与相似的图表，但我想实现的是:

I have a chart which is similar to this one but what I'd like to achieve is:

• 替换Y值(数据标签:15、40，依此类推.)
• 避免文本重叠，而不是数字:长文本"与iPhone大小重叠

在没有指定dataLabels的x和y位置的情况下，还有其他选择吗?

Is there any other option without specifying the x and y position of the dataLabels?

{
  "x": 1400457600000,
  "y": 15,
  "dataLabels": {
      "x": 25,
      "y": -5,
      "style": {
         "color": "#000000"
      }
   }
}

推荐答案

您可以使用此示例可以检测到碰撞.

You can use this example which detect a collision.

 events: {
                load: function() {
                    StaggerDataLabels(this.series);
                },
                redraw: function() {
                    var series = this.series;
                    setTimeout(function() {
                        StaggerDataLabels(series);
                    }, 1000);
                }
            },

这篇关于高图表响应数据标签显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！