Почему строка не отображается на высоких диаграммах?

Question

Я пытаюсь сделать диаграмму пончика, используя highcharts. С onmouseover Я хочу скрыть все метки и показать выбранную метку данных. Я могу сделать это используя следующие строки:

that.series.dataLabelsGroup.hide(); 
that.dataLabel.show(); 

Но она также скрывает свою линию, которую я подключиться к значению данных диаграммы. Почему строка не отображается в высоких диаграммах? Вот мой код:

// Mouseover handler 
function(e) { 
    var that = this; 
    var series = this.series; 
    console.log(series); 

    for (var i = 0; i < series.data.length; i++) { 
     var point = series.data[i]; 
     console.log(point) 

     if (point == this) { 
      console.log('yes'); 
      point.update({ 
       color: series.chart.options.colors[this.index] 
      }); 
     } else { 
      point.update({ 
       color: '#CCCCCC' 
      }); 
     } 
    } 
    that.series.dataLabelsGroup.hide(); 
    that.dataLabel.show(); 

    return false; 
} 

jsfiddle http://jsfiddle.net/nyhmdtb8/11/

Answer 1

Вы не должны использовать SVG элементы напрямую, но вы можете скрыть все необходимые метки данных во время обновления точки.

этикетки Показать данные:

point.update({ 
       color: series.chart.options.colors[this.index], 
       dataLabels: { 
        enabled: true 
       } 
       }); 

и скрытие данных метки:

point.update({ 
       color: '#CCCCCC', 
       dataLabels: { 
        enabled: false 
       } 
       }); 

пример: http://jsfiddle.net/nyhmdtb8/12/