2015-09-01 4 views
0

Я работаю над highcharts, и у меня есть проблема с легендой. У меня есть 4 столбца в легенде круговой диаграммы и вам нужно дать заголовки каждому из этих столбцов. Я использую следующий код, и результат приведен ниже.Добавить ярлыки в столбцы в легендарной диаграмме диаграмм высоких диаграмм

pie chart - 4 columns legend

   useHTML: true, 
       labelFormatter: function() { 

        return '<div style="width:800px"><span style="float:left;width:200px">' + this.name + '</span><span>' 
         + this.description + '</span><span style="float:right;width:100px">' + this.target + '</span><span style="float:right;width:100px">' + Highcharts.numberFormat(this.y, 0) + '%</span></div>'; 
     } 

ответ

1

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

$legend = $('#customLegend'); 

    $.each(chart.series[0].data, function (j, data) { 

     $legend.append('<div class="item"><div class="symbol" style="background-color:'+data.color+'"></div><div class="serieName" id="">' + data.name + '</div></div>'); 

    }); 

    $('#customLegend .item').click(function(){ 
     var inx = $(this).index(), 
      point = chart.series[0].data[inx]; 

     if(point.visible) 
      point.setVisible(false); 
     else 
      point.setVisible(true); 
    }); 

http://jsfiddle.net/N3KAC/1/

+1

Большое спасибо. Вы сделали мой день :) – sunny

+1

Нигде не нашел это решение, вы гений. – sunny