0

シリーズを、x 軸は同じで y 値が異なる外部変数と比較したいと思います。問題を説明しやすくするために、サンプル コードをここに示します。

データ系列は

series: [{data: [5, 4, 5, 7, 8, 6, 3, 6, 7, 4, 8, 9]},
   {data: [4, 6, 7, 9, 5, 9, 12, 11, 9, 7, 6, 5]}]

外部変数は

var extdata = [2,2,2,1,0,0,0,1,1,2,2,2];

これらは同じ x 軸を共有します (この例では、1 月、2 月、...、12 月)。その月の系列のデータ ポイントと外部変数の対応するエントリが少なくとも 10 の場合にツールチップ「最大」を表示し、それ以外の場合は合計の数値を保持して、3 月のツールチップが次のようになるようにしたいとします。

March:
Series 1: 7
Series 2: 9

そしてそれは4月に読む

April:
Series 1: 8
Series 2: Max

ツールチップフォーマッタのみを使用してこれを行うことは可能ですか? そうでない場合、これをどのように達成できますか？ありがとう！

4

2 に答える 2

0

分類されたものについては、StevePの回答はかなり良いものです. ただし、データをフォーマットしたくない場合は、次のようにします。

s+= '<br/>Ext data: ' + extdata[this.points[0].point.x];

ここで、this.points[0].point.xは外部データ インデックスのインデックスと同じです。jsフィドル


ただし、xAxis が分類されていない場合はthis.x、前の回答jsFiddleのように単純にインデックスを取得できます

于 2013-04-04T12:01:54.063 に答える
0

これを行うにはいくつかの方法がありますが、私が考える最も簡単な方法は、extdata を次のようにフォーマットすることです。

var extdata = {'Jan':2,
           'Feb':2,
           'Mar':2,
           'Apr':1,
           'May':0,
           'Jun':0,
           'July':0,
           'Aug':1,
           'Sep':1,
           'Oct':2,
           'Nov':2,
           'Dec':2};

次に、ツールチップ関数で、次のように参照できます。

formatter: function () {
        var s = '<b>' + this.x + '</b>';
        var month = this.x;
            $.each(this.points, function (i, point) {
                var total = point.y + extdata[month];
                s += '<br/>' + point.series.name + ': ' + (total>=10?'max':point.y);
            });
        return s;
    },

http://jsfiddle.net/3uhge/

月の extdata にインデックスを付けることで、どのポイントにカーソルを合わせているかを調べる必要がなくなります。必要に応じて、月の名前を探してカテゴリを反復処理することで、これを解決できます。

于 2013-04-04T10:21:52.510 に答える