読者です 読者をやめる 読者になる 読者になる

jnobuyukiのブログ

JavaScriptとR言語を中心に研究活動に役立つwebアプリケーション技術について考えていきます。twitter ID: @j_nobuyuki

Google Chartsを利用したヒストグラムの作成

Google Charts JavaScript

Google Chartsでは、前に紹介した棒グラフ以外にもいろいろなグラフのAPIが用意されています。今回は、分析の初期段階でよく使うヒストグラムの作り方です。

ポイントとしては、驚くほど簡単につくれるということ。なぜか?それは前回の棒グラフのコードの大部分を生かせるからです。書き換えるのは次の一行だけでした。

//棒グラフなら
var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    
//ヒストグラムなら
var chart = new google.visualization.Histogram(document.getElementById('chart_div'));
    

ここを変更しただけで、前に紹介したグラフは以下のようになります。



データの入力形式は全く同じ。作るグラフの指定が違うのみです。これは強力ですね。

一つだけ注意するとしたら、1つの指標のヒストグラムを作る場合でもケースを示すラベルが必要なことです。つまり、他次元配列のデータ部にはなぜか2要素以上含まれていないといけないです。値のみのデータ入力ではエラーが返されます。