一年目の若手エンジニアに、データビジュアライゼーションのトレーニングを兼ねて、SVGでグラフを作ってもらいました。 作成物概要 総務省統計局の平成29年11月時点の人口データを元に各年齢ごとの人口を男女別にグラフを作成しました。 横軸に年齢(5歳ごとの分類)、縦軸に人数(単位:千人)で男女別で表示しています。 男性を青、女性を赤、合計を灰色に設定しています。 また、縦軸最大値と人口の最大値をあわせたり、グラフの大きさをウィンドウサイズ丁度に表示されるように作成しました。 SVGの基本的な使い方 SVGタグの中にSVG要素を書いていきます。具体的には以下の通りです。 <svg viewbox="0 0 400 500" width=400 height=500> <!-- ここに書きたい物を書いていく --> </svg> viewboxとは? 描画領域を"x y width height"