Highcharts を使ってみるよ

Highcharts は JavaScript でグラフを描画するためのツール
サイトのサンプル 見ると、jqplot より機能が豊富そう。
あ、redmine で使うことを想定してます。

ダウンロード

http://highcharts.com/download から。

インストール

public/javascripts に js 配下のファイルをコピー。

使い方

http://www.highcharts.com/documentation/how-to-use を参考に。
基本は jqplot と変わらない。 div で領域を確保して、グラフを書く。

http://highcharts.com/demo/ のデモから自分のやりたいことを探して、ソース見ればまぁまぁ大丈夫。

日付の指定

"Date.UTC(2010,9,31)" のように、JavaScript のコードとして指定する。
文字列での指定は無理なのかな?

データを後から注入

series の setData を使う。

var chart = new Highcharts.Chart({
    chart: {
      renderTo: 'container',
    },
    series: [{
      name: 'value',
    }, {
      name: 'cost',
    }]
});
var series_0_data = [0,1,2];
var series_1_data = [2,3,4];
chart.series[0].setData(series_0_data, false);
chart.series[1].setData(series_1_data, false);
chart.redraw();