Processingのテキストをそのままやるだけ①(地図上に人口密度の表示)
こちらはジャンルなしオンラインもくもく会 Advent Calendar 2024 5日目の記事になります。
最近大学の授業でProcessingというグラフィックプログラミング言語?を使っています。なんと4日後までに自由課題を出さないといけないのですが、まだProcessingが全然わからなくてまずいので、4日後までに完全に理解したいと思います。
とりあえず今回は以下のテキストを参考にしつつ、地図上にデータを表示するところをゴールに作業してみようと思います。
10分経過
とりあえず3行だけ写経しました(おせぇ)
PImage japanMap = loadImage("map-japan.png");
size(822, 850);
image(japanMap, 0, 0);
この状態で実行するとPNG画像だけでてきます。
20分経過
なんか県ごとに円は表示できた(円の大きさに人口密度を反映させるのはまだ出来てない)けど、明らかに円の位置がおかしいぞ!ってなって大汗をかいたのですが、
Processingでは右に行くほどx座標が大きくなり、下に行くほどy座標が大きくなります。
なので、経度が大きくなるとx座標は大きくなるけど、緯度が大きくなると(北半球では)y座標が小さくなる、という所で混乱して、x座標の値をまちがえてしまっていました
コードを直して実行しなおすと、以下のようになりました。
PImage 日本地図の画像 = loadImage("map-japan.png");
size(822, 850);
image(日本地図の画像, 0, 0);
Table 表 = loadTable("population.csv", "header");
int 行数 = 表.getRowCount();
println(行数);
for (int i=0; i< 行数; i++){
float 緯度 = 表.getRow(i).getFloat("lat");
float 経度 = 表.getRow(i).getFloat("lon");
float 円の大きさ = 10;
float x = map(経度, 122, 148, 0, 850);
float y = map(緯度, 24, 46, 822, 0);
ellipse(x, y, 円の大きさ, 円の大きさ);
}
30分経過
円の直径を人口密度に比例させると、以下の画像のように、人口密度の小さい県と大きい県で、円の大きさにちがいが出すぎてしまいます。
float 円の大きさ = map(人口密度, 0, 10000, 0, 50);
平方根を計算することで、円の面積を人口密度に比例させられて、少しいい感じな気もします。
float 円の大きさ = sqrt(map(人口密度, 0, 10000, 0, 1000));
円のぬりつぶしの色に透明度を加えることで、重なり合った部分がつぶれた感じにならないようにしたい...のですが、難しいです...
fill(150, 150, 250, 150);
40分経過
最終的にコードは以下のようになりました。
(※このコードは以下のテキストの、山辺真幸さんのコードをほぼ写経したものです。途中少し配列の作成などを省略し、変数名を個人的趣味により変更している以外は、ほとんど同じです)
PImage 日本地図の画像 = loadImage("map-japan.png");
size(822, 850);
image(日本地図の画像, 0, 0);
Table 表 = loadTable("population.csv", "header");
int 行数 = 表.getRowCount();
println(行数);
noStroke();
fill(250, 150, 150, 120);
for (int i=0; i< 行数; i++){
float 緯度 = 表.getRow(i).getFloat("lat");
float 経度 = 表.getRow(i).getFloat("lon");
float 人口密度 = 表.getRow(i).getFloat("population");
float x = map(経度, 122, 148, 0, 850);
float y = map(緯度, 24, 46, 822, 0);
float 円の大きさ = sqrt(map(人口密度, 0, 10000, 0, 1000));
ellipse(x, y, 円の大きさ, 円の大きさ);
}
最終的な地図はこんな感じになりました。このようにみると、関東・関西は本当にデカすぎだな~(月並みな感想)と思います。
(今気づいたのですが、このデータは「県の人口」ではなく「県の人口密度」だから、東京・大阪・京都などの「ちっちゃくて人が多い県」が、人口以上にデカい円になっているんですね)
とりあえず「地図上にデータを表示する」テキストは軽く触れられたので、次の記事では以下のテキストを用いて、より少し複雑な地理データの可視化についてもチャレンジしてみたいと思います
最後まで読んでくださり、ありがとうございました!
Discussion