2017-04-26 12 views
1

ハイチャートで作成された散布図のすべてのデータラベルを明確に表示したい。ハイチャート - 重複する散布図ラベルが読み取れない

私は、ポイントが重なり合っているか、非常に近くにある可能性がある散布図を持っています。デフォルトでハイチャートは重なり合うラベルを隠しますが、すべてのラベルを表示する必要があります。 私は 'allowOverlap:true'を設定しようとしました。これにより、すべてのラベルが必要に応じて表示されますが、ラベルは必ずしも読み込み可能ではありません。 すべてのラベルが散布図に表示されるようにするためのよりクリーンな方法はありますか。唯一の3〜4のラベルが表示され

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, 
     } 
     } 
    } 

}); 

答えて

3

Highcharts現在doesn't have collision detection for labelsが、an answer to a similar question上の建物は、あなたが(ここでは:staggerDataLabels())あなた自身の衝突検出器を実装することができますし、グラフの上でそれを実行しますloadredrawイベント:

Highcharts.chart('container', { 
    chart: { 
    events: { 
     load: function() { 
     staggerDataLabels(this.series); 
     }, 
     redraw: function() { 
     staggerDataLabels(this.series); 
     } 
    }, 
    }, 
    ... 
}); 

function staggerDataLabels(series) { 
    ... 

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