グラフが簡単に作れる jqPlot

2016年2月14日

後輩が教えてくれたのだけど、jQuery
を使っているライブラリで簡単にグラフを作れるそうな。
なんか使えないかな?っと思って少し触ってみました。

まずは公式ページの「Download」からファイルを取ってきて、適当なとこに配置する。

jqPlot – pure javascript plotting –

前準備としては、jQuery と jqPlot と読み込んでおいて、グラフを表示するキャンパスになる部分を用意する。

読み込むファイル

<script class="include" type="text/javascript" src="/js/jquery.min.js"></script>
<script class="include" type="text/javascript" src="/js/jquery.jqplot.min.js"></script>

グラフを表示するキャンパス

<div id="graph1" style="height:250px;width:450px;"></div>

最初にどれだけ簡単かと言うところを見せるために、ただこの 3 行だけを書いてみる。

$(document).ready(function(){
    var plot1 = $.jqplot('graph1', [[1,5,7,5,3]]);
});

他にも色々試してみようと思う。