2014/09/05

[jQuery][jqplot]積み重ねの棒グラフのX軸を設定

前回、積み重ねの棒グラフを作る方法について書きました。

で、それをベースにX軸上の各メモリ値を変更することができないかなーっと調べていたら、

jqplotによるグラフの描き方

に方法が記載されていたので、それを参考に前回のプログラムを下のように修正しました。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="./jquery.jqplot.min.js"></script>
<script src="./plugins/jqplot.barRenderer.min.js"></script>
<script>
d = [
    [2,3],
    [4,6]
];
$.jqplot('barchart', d ,{
    stackSeries: true,
    seriesDefaults:{
      renderer:$.jqplot.BarRenderer,
      highlightMouseDown: true,
      pointLabels: {show: true}
    }
    axes:{
      xaxis:{
        renderer: $.jqplot.CategoryAxisRenderer,
        ticks:['foo','bar']
      },
      yaxis:{
        min:0
      }
    }
    series:['red','yellow']
});
</script>
xaxisキーのticksパラメータの設定で変更できます。

探すのにどえらい時間がかかったので、こうしてまとめておくと、次回からさくっと作れるのでいいかなと。

0 コメント:

コメントを投稿