highcharts - シリーズとフラグの両方のハイチャート/ストック ツールチップ フォーマッター

Question

次の例では、シリーズとフラグの両方のツールチップをどのようにフォーマットできますか?

http://jsfiddle.net/gh/get/jquery/1.7.1/highslide-software/highcharts.com/tree/master/samples/stock/plotoptions/flags/

シリーズのツールチップに追加情報を表示し、フラグのツールチップにその他のデータを表示したいと考えています。

Answer 1

次の関数をツールチップ フォーマッタとして使用します -

tooltip: {
  shared:true,
formatter: function(){
        var p = '';
        console.log(this);

        if(this.point) {
          p += '<b>'+ Highcharts.dateFormat('%A, %b %e, %Y', this.point.x) +'</b><br/>';
          p += this.point.config.text // This will add the text on the flags
        }
        else {              
          p += '<b>'+ Highcharts.dateFormat('%A, %b %e, %Y', this.x) +'</b><br/>';
          $.each(this.points, function(i, series){
            p += '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>'+ this.y + ' kWh ($' + Highcharts.numberFormat(this.y * rate, 0) + ')</b><br/>';
          });

        }
        return p;
      }}

この JSFiddle も参照してください: http://jsfiddle.net/aTcFe/

Answer 2

1 つの方法は、現在のオブジェクトがポイントかどうかを確認するツールチップ フォーマッタを作成することです。

tooltip: {
            formatter: function(){
                if(this.point) {
                    return "this is a flag"
                }
                else {
                    return "this is a line"
                }
            }                
        }

さらに一歩進んで、フラグに名前を付けてから、ポイントに名前があるかどうかを確認して（存在するだけでなく）、フラグ以外のポイントが同じ形式になるのを防ぐことができます。

以前のhttp://jsfiddle.net/aTcFe/を反映するように変更された例を次に示します