Highcharts JSは1000件を超えるデータはプロットできません。デフォルトでは。
移転しました →
昨日の記事でHighchartsについて話題にしました。今日は実際にHighchartsを使った際に思いっきりハマったところがあるので、そこについて書いておきます。
昨日紹介したシンプルな例ではHighchartsに渡したデータ列には値のみが入っていました。このようなケースではデータ数は問題になりません(リファレンスによるとそのはず)。
ですが、Highchartsではデータ一つ一つに名前を付けたり任意のキーで値を渡したりすることができます。
一つ一つのデータはjson的な構造になっています。y
というキーはY軸用の値、name
というキーはツールチップに用いられる名前用の値です。それ以外にも任意のキーを使うことができます。
$(function () { $('#chart').highcharts({ series: [{ data: [{y:3,name:"s6w1vnde"},{y:7,name:"t4g5qc7h”},…] }] }); });
このようなデータを渡す場合はデフォルトのデータ上限が1000までとなっていて、1000よりも多いデータを渡すと何も表示されなくなってしまいます。エラーは出ません。
確認のためにデータ数を1001にしてみます。
resultタブを見ればわかりますが、グラフが描画されていません。
どうせなんかパラメータがあるんだろうと思ってHighchartsのリファレンスをlimit
とかmax
で検索したのですが全然ヒットせず、困り果てました。
結局なんだったかというと、turboThreshold
とかいう直感的でないパラメータがありました。わかりづれえ!
このturboThreshold
は次のような感じで設定します。
$('#chart').highcharts({ series: [{ turboThreshold: 0, // ゼロで無制限、数値でその値まで許す data: […] }] });
さきほどと同じデータ数ですが、こちらは表示されます。