フリーのJavaScriptライブラリ「Chart.js」で面グラフ+折れ線グラフが描けて感動した件 - Qiita

TL;DR Chart.jsで面グラフを描きました（棒グラフや折れ線グラフも描けるよ） 面グラフ+折れ線グラフのような複合グラフも描けます はじめに 業務でとある残高の推移のグラフを内訳付きで（ここではA残高、B残高とします）既存のWebシステムに表示することになりました。 調べてみるとChart.jsにより数値の推移を簡単にグラフにできるとのことで、今回は面グラフを描いてみることにしました。 面グラフとは？ 折れ線グラフに対し、X軸と折れ線、または他の折れ線の間の領域に色を塗ったものが面グラフと呼ばれるものです。 折れ線グラフではすべてX軸基準で大きさを表すため、それぞれのデータの値を比較するのに向いています。 対して面グラフではあるデータの上に別のデータが積み上がる形で表現されるため、データ全体の量とその内訳・比率を可視化するのに向いています。 面グラフの例 折れ線グラフの例 棒グラフ