Question

在我的图表中，我将一个类与每个系列的数据组合在一起。在某些时候，我隐藏了一个系列的数据。但是，如果现在我显示/隐藏任何其他系列，则会显示隐藏的数据。

我做了一个jsfiddle例子。请执行以下步骤以查看我的含义：
1.单击按钮1以隐藏系列1上的数据 2.隐藏系列2

现在系列1上的数据表现出来了。我怎么能阻止这种行为？

jsfiddle链接：http://jsfiddle.net/jmogexfj/2/

$(function () {

button1();

$('#container').highcharts({

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    plotOptions: {
        series: {
            dataLabels: {
                enabled: true,
                 useHTML: true,
                    formatter: function () {
                        return '<div class="label_'+this.series._i+'">' + this.y + '</div>';
                    }
            }
        }
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    },
                {
        data: [10.9, 50.5, 60.4, 100.2, 104.0, 106.0, 120.6, 108.5, 106.4, 104.1, 90.6, 50.4]
    }]
});
});


 function button1(){
   $("#b1").click(function(){
    $(".label_0").toggle();
    });
}

Answer 1

这就是Highcharts图书馆的工作方式。更新图表时（如按图例隐藏，调整窗口浏览器大小等），会重新绘制元素。

要隐藏dataLabels，请使用series.update()：

    $('#container').highcharts().series[0].update({
        dataLabels: {
            enabled: false   
        }
    });

演示：http://jsfiddle.net/jmogexfj/4/

如果您确实需要使用类，请使用chart.events.redraw在每次重绘时显示/隐藏dataLabel：http://jsfiddle.net/jmogexfj/5/

Highcharts示例：

    chart: {
        events: {
            redraw: function () {
                var showOrHide = display ? 'show' : 'hide';
                $(".label_0")[showOrHide]();
            }
        }
    },

点击按钮：

function button1() {
  $("#b1").click(function () {
    display = !display;
    $(".label_0").toggle();
  });
}

show / hide系列消除了可数据化的样式

1 个答案: