Blog

animationなグラフが描けるChartist.js使ってみました

2016.01.12Cat:css3 Responsive Web Design SVG

SVGに対応していて、responsiveなグラフが描けるChartist.jsというものを使ってみました。

準備

headerの中に、

を加えるか、bowerの

でインストールし、適切な場所に設置する。

デモ

シンプルな線形チャート

デモ

グラフを順番に描写するもの

デモ

形を変えた棒グラフ

デモ

おわりに

  • プラグインもあるようです。
  • 参考:Chartist – Plugins

  • SVGを自由に扱えると、もっと面白いグラフが描けるようです(私は自由に扱えないので勉強します)。
  • 参考:Chartist – Examples

Author Profile

mizutani
» 投稿一覧
  • Launch Cart次世代ECサイト構築システム 初期月額無料
  • LaunchMovie ECに特化した動画制作サービス

Archive

ページTOPへ