Highcharts JSは1000件を超えるデータはプロットできません。デフォルトでは。

昨日の記事でHighchartsについて話題にしました。今日は実際にHighchartsを使った際に思いっきりハマったところがあるので、そこについて書いておきます。

昨日紹介したシンプルな例ではHighchartsに渡したデータ列には値のみが入っていました。このようなケースではデータ数は問題になりません（リファレンスによるとそのはず）。

ですが、Highchartsではデータ1つ一つに名前を付けたり任意のキーで値を渡したりできます。

1つ一つのデータはjson的な構造になっています。yというキーはY軸用の値、nameというキーはツールチップに用いられる名前用の値です。それ以外にも任意のキーを使うことができます。

1$(function () {
2        $('#chart').highcharts({
3            series: [{
4                data: [{y:3,name:"s6w1vnde"},{y:7,name:"t4g5qc7h”},…]
5            }]
6        });
7    });

このようなデータを渡す場合はデフォルトのデータ上限が1000までとなっていて、1000よりも多いデータを渡すと何も表示されなくなってしまいます。エラーは出ません。

確認のためにデータ数を1001にしてみます。

resultタブを見ればわかりますが、グラフが描画されていません。

どうせなんかパラメータがあるんだろうと思ってHighchartsのリファレンスをlimitとかmaxで検索したのですが全然ヒットせず、困り果てました。

結局なんだったかというと、turboThresholdとかいう直感的でないパラメータがありました。わかりづれえ！

このturboThresholdは次のような感じで設定します。

1$('#chart').highcharts({
2  series: [{
3    turboThreshold: 0, // ゼロで無制限、数値でその値まで許す
4    data: […]
5  }]
6});

さきほどと同じデータ数ですが、こちらは表示されます。