ITエンジニア/デザイナ向けにオープンソースを毎日紹介

YokulはCanvasタグを使ってGoogle Chart API互換のグラフを描くJavaScriptライブラリ。

YokulはJavaScript/HTML5製のオープンソース・ソフトウェア。Webサービスで工数がかかりやすいのがグラフの表示だ。システムから得られるデータを使って動的に変化させるため作るのが大変だ。そんな中、よく使われるのがGoogle Chart APIだ。


サンプル

Google Chart APIを使えば画像ベースのグラフが簡単に作成することができる。しかし場合によっては外部にデータを渡すために利用できないかもしれない。そんな時に使えるのがYokulだ。

YokulはGoogle Chart API互換のグラフライブラリだ。さらに面白いのがサーバサイドの仕組みを用いないことだ。つまりCanvasタグを使ってJavaScriptだけでグラフを描くのだ。使い方も簡単で、これまではimageタグのsrcに指定した内容を、data-srcに指定するだけだ。


こんな複雑なグラフも

後はYokulのJavaScriptがdata-srcの内容を読み込んでGoogle Chart APIそっくりのグラフを描き出す。今の所は棒グラフにのみ対応し、今後円グラフなどに広がっていく。Canvasで描くだけにJavaScriptからのダイナミックな操作にも対応しており、使い勝手の良さそうなライブラリだ。


MOONGIFTはこう見る

Google Chart APIではサイズの制限があるが、Yokulではそのような制限がない。またデータを徐々に変化させていくことでアニメーションをするといったことも考えられる。またGoogle Chart APIの場合はネットワーク接続が必須だが、Yokulの場合はオフラインでも利用できる。

Canvasであるためのレガシーなブラウザでは対応できないこともあるだろう。特定のブラウザだけに対応するか、スマートフォン向けなどで使うのが良さそうだ。JavaScript製のグラフライブラリとして見ても興味深い、面白いソフトウェアだ。

Yokul: Local Google Charts

city41/yokul - GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2