MULTISOUP

MULTISOUP

MULTISOUP

Staff Blog

Introduction example

2018.04.08

Googleマップ上に将来推計人口をメッシュで描画する

将来推計人口

みなさん、こんちちは。

前回は、Googleマップ上に地域メッシュを緯度経度から計算して描画する方法を解説しました。しかし、ただ地域メッシュを描画しても使い道がありません。統計情報のデータを利用し色分け表示する等するほうが多いです。

Googleマップに地域メッシュを描画する

 

そこで、今回は国土地理院が公開している「1kmメッシュ別将来推計人口」データを用いて地域メッシュを描画してみたいと思います。前回と異なる点は、国土地理院のデータは Shape形式で公開されているため、地域メッシュを緯度経度から計算する必要はないことです。

 

では、早速データのダウンロードから開始します。以下のサイトにアクセスして下さい。

http://nlftp.mlit.go.jp/ksj/

 

 

ページの最下部に「1kmメッシュ別将来推計人口 ダウンロード(H29国政局推計)(shape形式)」というリンクがあるので、クリックします。

1kmメッシュ別将来推計人口 ダウンロード1

 

 

次に、ダウンロードする都道府県の選択ページになります。今回は「東京都」をチェックし、「次へ」ボタンをクリックします。

1kmメッシュ別将来推計人口 ダウンロード2

 

 

ダウンロードするファイルの選択ページになりますので。「」をチェックし、「次へ」ボタンをクリックします。

1kmメッシュ別将来推計人口 ダウンロード3

 

 

最後にアンケートページが表示されますので、アンケートを記入し「回答する」ボタンをクリックします。

1kmメッシュ別将来推計人口 ダウンロード4

 

 

利用規約が表示されますので、よく読み同意できる場合は、「はい」ボタンをクリックします。

1kmメッシュ別将来推計人口 ダウンロード5

 

 

ファイルをダウンロードするページが表示されますので、「ダウンロード」ボタンをクリックします。

1kmメッシュ別将来推計人口 ダウンロード6

 

 

zip形式のファイルがダウンロードされたと思いますので、解凍してください。解凍すると、4ファイルが作成されるはずです。最初に述べた通り、今回使用するファイルは、Shape形式になります。Googleマップにそのまま読み込むことができませんので変換する必要があります。今回は、QGISというオープンソースのフリーソフトを使用し、GeoJSON形式に変換します。

 

QGISは、以下のサイトよりダウンロードしてインストールしてください。最近バージョン3が公開されましたが、まだ利用したことがないので、バージョン2.18を利用します。

https://qgis.org/ja/site/forusers/download.html

 

 

インストールができましたら、QGISを起動し、先程解凍したファイル内の「Mesh3_POP_13.shp」をドラッグしてください。下図のように、東京都の1kmメッシュが描画されます。

1kmメッシュ別将来推計人口  QGIS1

 

GeoJSONに変換するため、サイドメニューの「Mesh 3 POP13」上を右クリックし「名前を付けて保存する」をクリックします。

1kmメッシュ別将来推計人口  QGIS2

 

保存ダイアログが表示されますので、形式「GeoJSON」、CRS「選択CRS(EPSG:4612、JGD2000」を選択し、保存してください。

1kmメッシュ別将来推計人口  QGIS3

 

今回利用するデータには、以下の属性が登録されているので、この数値を利用して色分けをしてみます。

属性名 説明
MESH_ID 基準地域メッシュ(第3次地域区画)コード
CITY_CODE 5桁の市区町村コード
POP2010 1kmメッシュ別2010年人口数(補正あり)
POP2020 (A~D)

1kmメッシュ別2020年人口数(補正あり)

※0-14歳人口(A)、15-64歳人口(B)、65歳以上人口(C)、75歳以上人口(D)

POP2025 (A~D) 1kmメッシュ別2025年人口数(補正あり)
POP2030 (A~D) 1kmメッシュ別2030年人口数(補正あり)
POP2035 (A~D) 1kmメッシュ別2035年人口数(補正あり)
POP2040 (A~D)

1kmメッシュ別2040年人口数(補正あり)

POP2045 (A~D) 1kmメッシュ別2045年人口数(補正あり)
POP2050 (A~D) 1kmメッシュ別2050年人口数(補正あり)
INDEX2020 (A~D)

2010年人口数を100とした場合の2020年人口数の指数(1kmメッシュ別)

※0-14歳人口(A)、15-64歳人口(B)、65歳以上人口(C)、75歳以上人口(D)

INDEX2025 (A~D) 2010年人口数を100とした場合の2025年人口数の指数(1kmメッシュ別)
INDEX2030 (A~D) 2010年人口数を100とした場合の2030年人口数の指数(1kmメッシュ別)
INDEX2035 (A~D) 2010年人口数を100とした場合の2035年人口数の指数(1kmメッシュ別)
INDEX2040 (A~D)

2010年人口数を100とした場合の2040年人口数の指数(1kmメッシュ別)

INDEX2045 (A~D) 2010年人口数を100とした場合の2045年人口数の指数(1kmメッシュ別)
INDEX2050 (A~D) 2010年人口数を100とした場合の2050年人口数の指数(1kmメッシュ別)

 

 

Google Maps JavaScript API には、GeoJSON形式のファイルを描画するためのメソッドがあります。また、スタイルを指定することにより、人口の数値によって色を設定することが可能です。以前のブログでも紹介しました。

GoogleマップにGeoJSONで図形を描画する

 

// 地図を初期化
var map = new google.maps.Map(document.getElementById("map"), {
	zoom : 10,
	center: new google.maps.LatLng(35.7, 139.7),
	mayTypeId: google.maps.MapTypeId.ROADMAP,
});
// GeoJSONを読み込み
map.data.loadGeoJson('geojson/13.geojson');
// スタイルを設定
map.data.setStyle(function(feature) {
	// 2020年の人口総数
	var val = feature.getProperty("POP2020");
	// 人口総数によって色を決定
	var color = "#000000";
	if (val > 10000) {
		color = "#ff0000";
	} else if (val > 5000) {
		color = "#00ff00";
	} else if (val > 1000) {
		color = "#00ff00";
	}
	return ({
		fillColor: color,
		fillOpacity: 0.5,
		strokeColor: '#ff0000',        
		strokeWeight: 1,
		strokeOpacity: '0.5',
		clickable: true,
		zIndex: 1
	});
});

 

サンプルのデモサイトを作成しました。

Full Screen

 

いかがでしょうか。

データさえあれば、色分けしてのメッシュの表示は簡単に行えます。

一番難しいのはデータを用意することですが、政府が公開している「政府統計の総合窓口(e-Stat)」からも様々な統計データをダウンロードすることができます。

https://www.e-stat.go.jp/

 

 

今回は、ShapeファイルからGeoJSONに変換して作業を行いました。静的なデータを表示するだけであれば、今回の方法でも良いのですが、動的に何かをしたい!や全国のデータを表示したい!という場合には、GeoJSONは向きません。(多分)

そのような場合、PostgreSQL に拡張ユーティリティ「PostGIS」を用いると良いです。Shapeファイルを変換すれば、PostgreSQLにデータを登録できるので、SQLでデータを抽出することが可能になります。次回は、その方法を解説していこうと思います。

 

 

 

 

【関連記事】こんな記事も読まれています

2016.09.27

MarkerClusterer ライブラリの紹介

みなさん、こんにちは!

 

Google Maps 上に 店舗の情報などマーカーをたくさん描画したとき、マーカーが重なっ・・・

続きを読む

2017.06.10

Street View Image API を初めて使ってみました

みなさん、こんにちは!

来週の 6月14、15日は、Google Cloud Next'17 が開催されます。皆さん、申込みしましたか? 

続きを読む

2017.12.17

マーカーにスタイルを適用してラベルを描画する

みなさん、こんにちは。

今回は Google Map JavaScript API でマーカーを描画する際に、スタイルを適用したラベルの描画方・・・

続きを読む

 - GIS, Google Maps JavaScript API, スタッフ日記

お問い合わせお見積もりから開発のご相談まで、お気軽にお問い合わせください。

Google Maps for Work™に関するご質問やお見積りは、
マルティスープまでお気軽にお問い合わせください03-3518-9013 (受付時間:平日 9:00−18:00)