1

プロジェクトに Highcharts JS を使用していますが、クリックした凡例項目を参照する方法がわかりません。クリックした凡例項目にクラスを切り替えて、アクティブ/無効な凡例項目にさまざまなスタイルを追加できるようにします。

legedItemClick イベントを使用すると、コンソール ログが起動されますが、子が見つかりません。(おそらく、これはレジェンド項目ではなくシリーズを参照しているためです)。例:

plotOptions:{
    line:{
        marker:{
            symbol:'circle',
            enabled: false
        },
        events: {
            legendItemClick: function () {
                $(this).addClass('new_class');
                console.log('click click');
                $(this).find('.legend-name').toggleClass('visible_true').toggleClass('visible_false');
                $(this).find('.legend-icon').toggleClass('visible_true').toggleClass('visible_false');
            }
        },
        showCheckbox: false
    }
},

ハイチャート クリック イベントを使用せずに凡例項目内のスパンで jQuery クリック ハンドラーを使用しようとすると、何も起こらず、コンソール ログも起動しません。これはおそらく、ハイチャートのデフォルトのクリックハンドラーがバブリングなどを防止しているためです。例:

$('body').delegate('.highcharts-legend-item span', 'click', function(){

    console.log('click');

    $(this).find('.legend-name').toggleClass('visible_true');
    $(this).find('.legend-icon').toggleClass('visible_true');
});
4

0 に答える 0