面グラフの説明を追加

This commit is contained in:
Kazuhiro MUSASHI 2020-06-18 22:10:20 +07:00 committed by Gitea
parent aecad16dfd
commit 5fce13869b
1 changed files with 11 additions and 0 deletions

View File

@ -422,6 +422,17 @@ chart=true
{{< /chart >}} {{< /chart >}}
### 面グラフ ### 面グラフ
面グラフの特徴は以下のように説明されていました:
> 面グラフは1つの線を描き終えると、2つ目の先は先に引いた線上を0の基準とみなして再び線を描きます。2つ目の線は、1つ目に引かれた線を0という基準にしていいるのを明確にするために、1つ目に引いた線の下側を塗りつぶし、2つ目の線の下側と1つ目の線の上側も塗りつぶします。だから面グラフと言われています。
> 面グラフは必ず複数の時点、面の中に複数のデータ項目を描きます。面の内訳が1つだけ描かれる面グラフは単なる折れ線グラフです。そんな面グラフを目にする機会はないでしょう。面グラフでは、面の推移を比べて「全体に対して占める割合が大きい(小さい)データ量はどのように変化するのだろう?」と考えます。つまり面グラフが一番得意な表現方法は、データ全体の「内訳」の「推移」です。面グラフは、データ(数字)の総量と内訳の変化を最もわかりやすく図で表現できます。
>
> データ全体に対する特定のデータ項目の「推移」から内訳の変化を感覚的につかめるのが面グラフの特徴です。
> 面グラフは、円グラフが得意とする「内訳」と折れ線グラフが得意とする「推移」のどちらかを強調したいか決めれば、何が言いたいのかより伝わります。
面グラフの具体例は以下になります:
{{<chart canvas="area-stacked-chart" height="200">}} {{<chart canvas="area-stacked-chart" height="200">}}
const loggedIn = [26, 36, 42, 38, 40, 30, 12]; const loggedIn = [26, 36, 42, 38, 40, 30, 12];