jqplot ссылка легенд

Question

У меня есть основные круговые диаграммы сделаны с jqplot:

$(document).ready(function(){ 
    var data = [ 
    ['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14], 
    ['Out of home', 16],['Commuting', 7], ['Orientation', 9] 
    ]; 
    var plot1 = jQuery.jqplot ('chart1', [data], 
    { 
     seriesDefaults: { 
     renderer: jQuery.jqplot.PieRenderer, 
     rendererOptions: { 
      showDataLabels: true 
     } 
     }, 
     legend: { show:true, location: 'e' } 
    } 
); 
}); 

Теперь я хочу, чтобы добавить ссылки в легенде. Это возможно, и если да, то как?

Answer 1

Вы можете поместить HTML в метках:

$.jqplot(..., { 
    series : { 
    ... 
    label : "<a href='URL'>click me</a>" 
    } 
}); 

(или поставить эквивалент в legend части объекта конфигурации jqPlot).

Однако, возможно, потребуется настроить Z-индекс легенды, прежде чем они кликабельны:

.jqplot-table-legend { z-index: 1000 } 

Кроме того, я заметил, что некоторые параметры (например, позволяя зум) блокировать кликабельность наклеек.

Answer 2

//I used the below method to bring hyperlink on legends, it worked for me. I did the same thing for bar chart also. 

Это строка, которую я использовал для формирования массива.

strArr = "[< 'а OnClick = GoToSearch ("100") HREF = #> Нью-Йорк < '/ а>', 8561]"

arrOwner= eval("[" + strArr + "]") 

    $.jqplot.config.enablePlugins = false; 

       plotCAP_EquipCount1 = $.jqplot('piechartOwner', [arrOwner], { 
        grid: { 
         drawBorder: true, 
         drawGridlines: false, 
         background: '#ffffff', 
         shadow: false 
        }, 
        axesDefaults: { 
       }, 
       title: 'Ownership Data', 
       seriesDefaults: { 
        renderer: $.jqplot.PieRenderer, 
        rendererOptions: { 
         showDataLabels: true, 
         sliceMargin: 1, 
         startAngle: -90, 
         dataLabels: 'value', 
         highlightMouseOver: true, 
         highlightMouseDown: true 
        } 
       }, 
       legend: { 
        show: true, 
        placement: 'outsideGrid', 
        rendererOptions: { 
         numberRows: 10 
        }, 
        location: 'ne' 
       } 
      });