2017-08-16 5 views
0

私はスキャターシリーズのチャートを持っています。チャートのイベントリスナーを追加して、ツールチップの外側をクリックするとツールチップが閉じるようにしました。しかし、それは動作していないようです。ハイチャートでツールヒントをプログラムで閉じるにはどうすればいいですか?

ハイチャートバージョン4.2.3を使用しています。

http://jsfiddle.net/buc3pemq/

Highcharts.chart('container', { 

    chart: { events: { 
       click: function(event) { 
        var $this = this; 
        _.each(this.series[0].points, function(p){ $this.tooltip.refresh(p)}); 
       } 
       } 
}, 
    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 
           'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
    }, 

    tooltip: { 
     shared: true 
    }, 

    series: [ 
     { 
     data: [216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5], 
     type: 'scatter' 
    }] 
}); 
+1

あなたはあなたのツールチップを隠すためthis.tooltip.hide()を使用することができるはずです。http://jsfiddle.net/buc3pemq/1/ –

+0

ありがとう:) – Ramyani

+1

こんにちは、私はこの解決策に1つの問題が見ています。ツールチップの外をクリックすると一時的に閉じられますが、マウスを動かすと、以前に選択したツールチップが再び表示されます – Ramyani

答えて

2

私は私のコメントで述べたように、あなたのチャートのツールチップを隠すためtooltip.hide()を使用することができるはずです。

chart: { 
    events: { 
     click: function(event) { 
     var $this = this; 
     this.tooltip.hide(); 
     } 
    } 
    }, 
上記の方法でツールチップを隠す

ライブ例: http://jsfiddle.net/buc3pemq/1/

+0

こんにちは、私はこの解決策に1つの問題があります。ツールチップの外側をクリックすると、一時的に閉じられますが、マウスを移動すると、以前に選択したツールチップが再び表示されます – Ramyani

+0

この例のようなものを実現したいですか? http://jsfiddle.net/buc3pemq/2/ –

+1

しかし、ここで問題は一度外にクリックするとヒントが隠されてしまいますが、再び同じポイントにカーソルを合わせるとツールチップが表示されません。 – Ramyani

関連する問題