取得したデータをグラフ化して表示しようと思って、グラフやチャート関連のjavascriptをさがしていたら、Google Chart APIを見つけたので、利用してみました。
サンプルやドキュメントもあるので、それほど苦労することなく作成可能できます。基本的なグラフならですが。
今回、利用したチャートは、下記のCandlestick Charts（キャンドルスティックチャート）です。日本語だとローソク足と呼ばれるものです。
■Candlestick Charts
https://developers.google.com/chart/interactive/docs/gallery/candlestickchart
上記ページで表示されているHTMLを、そのままコピペで表示することができるのでまずは、これをコピペして試してみました。
多分、特に問題なくすぐにグラフを表示できると思います。
独自に変更する部分は主に、「var data」と「var options」の内容の部分です。
var data
データの順は「順番」「安値」「終値」「始値」「高値」です。順番データは曜日以外にも数字や日付でもOKで、あくまで横軸として使用します。
['Mon', 20, 28, 38, 45],
['Tue', 31, 38, 55, 66],
['Wed', 50, 55, 77, 80],
例：横軸が数字になるだけ。
['1', 20, 28, 38, 45],
['2', 31, 38, 55, 66],
['3', 50, 55, 77, 80],
すごく簡単にいろいろなグラフを作成することができますが、ローソク足で複合グラフをするのは難しくて断念しました。
jqplotのローソク足を試して比較してみようと思います。
