Highcharts - 重叠的散点图标签不可读

时间:2017-04-26 00:56:49

标签: javascript highcharts collision-detection

我想清楚地显示使用highcharts制作的散点图的所有数据标签。

我有一个散点图,有可能点可能重叠或非常靠近。默认情况下,highcharts隐藏任何重叠标签,但我要求所有标签都可见。 我试过设置'allowOverlap:true'。这使得所有标签都显示为我想要的,但标签并不总是可读的。 有没有更清洁的方法来确保所有标签在散点图上都可见,或者是否有人能够检测和偏移重叠标签?

JSFiddle,其中只显示四个标签中的三个: https://jsfiddle.net/jholwell/vbc58Luh/

Highcharts.chart('container', {
    series: [{
        data: [[1, 1], [1.8, 1.8], [1.9, 1.8], [5, 2]],
        type: 'scatter'
    }],
    plotOptions: {
      scatter: {
        dataLabels: {
            enabled: true,
        }
      }
    }

});

1 个答案:

答案 0 :(得分:3)

Highcharts目前为doesn't have collision detection for labels,但建立在an answer to a similar question之后,您可以实施自己的碰撞检测器(此处:staggerDataLabels())并在图表的load和{{ 1}}事件:

redraw

https://jsfiddle.net/vbc58Luh/2/