Highcharts：一个div的控制显示/隐藏通过单击饼图切片

Question

我有一个饼图。我所试图做的是显示/隐藏在点击的切片的UL认证。该UI将包含因人而异圆形切片额外的数据，所以我想显示/隐藏激活只能在它的切片。

此外，UL将能够在单击要关闭，但我也希望它把它的相应的圆形切片回馅饼。听起来很容易，但我不太清楚如何。

我想我一定要得到一些独特的ID和映射那些我打开/关闭功能？有人能帮助我指出正确的方向吗？这解释得不够好吗？

HTML：

<ul class="chart_data"> 
    <li>one</li> 
    <li>two</li> 
    <li>three</li> 
    <li id="hide">close table</li> 
</ul> 

图码：

plotOptions: { 
     pie: { 
      point: { 
       events: { 
        legendItemClick: function() { 
         show_table(); 
         this.select(); 
         chart2.tooltip.refresh(this); 
         return false; 
        } 
       } 
      }, 
      allowPointSelect: true, 
      cursor: 'pointer', 
      dataLabels: { 
       enabled: false 
      }, 
      showInLegend: true, 
      slicedOffset: 40 
     }, 
     series :{ 
      point: { 
       events: { 
        click: function() { 
         show_table(); 
        }, 
       }, 
      }, 
     }, 
    }, 

和显示/隐藏功能：

function show_table() { 
    $('.chart_data').toggle('slow'); 
    // there is other irrelevant stuff to this function, styling of the ul, etc. 
}; 

$('#hide').click(function() { 
    $('.chart_data').hide('slow'); 
}); 

Answer 1

，您可以选择与取消切片

chart.series[0].data[index].select(); 

其中index代表片的订单。

请参阅example