Question

我正在使用名为M Chart的Wordpress插件，该插件使用HighCharts在一个图表上显示带有5个折线图的折线图。

我创建了一些按钮，点击后我想隐藏图表上的某些系列。我尝试了各种但不能让它工作！有什么想法吗？

// Buttons
<div class="vid-chart-button only-reset">Reset All</div>
<div class="vid-chart-button only-totals">Only show Totals</div> </br>
<div class="vid-chart-button only-app">Only show App</div>
<div class="vid-chart-button only-events">Only show Events</div>
<div class="vid-chart-button only-sos">Only show SOS</div>
<div class="vid-chart-button only-magazine">Only show Magazine</div>



<script type="text/javascript">
jQuery(function($){  



$(".only-totals").click(function(){
    var chart = Highcharts.chart(".m-chart", {});
     $(chart.series[1]).hide();


}); 

}); 
</script>

Answer 1

以下示例显示了如何使用外部按钮

// Declare you chart
var myChart = $('#container').highcharts();

// Declare each button you want
$('#only-europe').on('click',function(){
    myChart.series[0].hide();
    myChart.series[1].hide();
    myChart.series[3].hide();
    myChart.series[4].hide();
});

Updated Fiddle - Thanks Patata

Highcharts javascript控件系列

1 个答案: