matsunagaPHPプログラマーの松永です。今回は、簡単に数値データをグラフ化することができるChartJSを使用したグラフの作成方法を紹介します。目次ChartJS公式サイトには、60個以上のサンプルがあり、自分のグラフを見つけることができます。用途により選択することができので、とても参考になります。https://www.chartjs.org/HTMLHTMLはとてもシンプルです。canvasを使用し、枠のみ作成するだけです。height="120"></canvas>CSS今回はCSSはありませんが、ChartJSのオプションでスタイルの指定を行っています。JsHTMLがシンプルな代わりに、Jsは少し記述が多くなります。グラフを作成するというコードとしては、とても少ないコードでグラフを作成することができます。メインは、「data→datasets→data」です。}});jsfiddle実際の動作をjsfiddleで確認できますので、是非動作させてみてください。ページのローディング直後にヌルッとグラフが整形される挙動は、ChartJSの挙動のまま使用しています。まとめ数値や日々の推移など、1つづつ見ていけば確認することができますが、パッと見で判断できるグラフはとても便利です。数値を管理するという機能があり、まだグラフを導入していないという方の参考にあれば幸いです。