Графики диаграмм диаграмм диаграмм диаграмм datalabels перекрываются

Question

Я использую диаграмму диаграммы highcharts. Серия динамически загружена, поэтому может быть когда-то только одно значение и несколько раз 10 значений. Я не могу дать установленную ширину. У меня проблема, когда Диалоговые метки в верхней части гистограммы перекрываются друг с другом, когда имеется множество значений. После проведения исследований в Интернете ближе всего я мог бы найти для этого вопроса на stackflow, который в течение двух или более серий

Overlap datalabels line chart highcharts

Есть ли способ, мы можем обнаружить совпадения для одной серии и настроить datalabel поэтому он не перекрывается друг с другом. Спасибо за любую помощь

Answer 1

В общем случае это решение не поддерживается, но вы адаптировать этот обходной путь

function StaggerDataLabels(series) { 
    sc = series.length; 
    if (sc < 2) return; 

    for (s = 1; s < sc; s++) { 
     var s1 = series[s - 1].points, 
      s2 = series[s].points, 
      l = s1.length, 
      diff, h; 

     for (i = 0; i < l; i++) { 
      if (s1[i].dataLabel && s2[i].dataLabel) { 
       diff = s1[i].dataLabel.y - s2[i].dataLabel.y; 
       h = s1[i].dataLabel.height + 2; 

       if (isLabelOnLabel(s1[i].dataLabel, s2[i].dataLabel)) { 
        if (diff < 0) s1[i].dataLabel.translate(s1[i].dataLabel.translateX, s1[i].dataLabel.translateY - (h + diff)); 
        else s2[i].dataLabel.translate(s2[i].dataLabel.translateX, s2[i].dataLabel.translateY - (h - diff)); 
       } 
      } 
     } 
    } 
} 

//compares two datalabels and returns true if they overlap 


function isLabelOnLabel(a, b) { 
    var al = a.x - (a.width/2); 
    var ar = a.x + (a.width/2); 
    var bl = b.x - (b.width/2); 
    var br = b.x + (b.width/2); 

    var at = a.y; 
    var ab = a.y + a.height; 
    var bt = b.y; 
    var bb = b.y + b.height; 

    if (bl > ar || br < al) { 
     return false; 
    } //overlap not possible 
    if (bt > ab || bb < at) { 
     return false; 
    } //overlap not possible 
    if (bl > al && bl < ar) { 
     return true; 
    } 
    if (br > al && br < ar) { 
     return true; 
    } 

    if (bt > at && bt < ab) { 
     return true; 
    } 
    if (bb > at && bb < ab) { 
     return true; 
    } 

    return false; 
} 

http://jsfiddle.net/menXU/6/.