位置情報とパブリックデータ#01: Vega-Lite地図可視化

2023年10月22日 21:03

Vega-Liteの可視化ですが、地図の可視化にも利用可能です。ただ、残念ながらJupyter Lab上で地図の可視化はできないようです。そのためVSCodeの以下拡張機能を用います。拡張機能をインストールし、jsonファイルを開いてCtrl+Alt+vを押すと描画してくれます。

仕組みとしてはjsonファイル内で各種グラフ表現の定義を行い、その中にデータファイルも定義していて、そこから対象データを参照する仕組みます。そして位置情報、地図の可視化を行う場合は、レイヤーごとにこのファイルを定義してあげることになります。地図の情報を記載したファイルがtopojsonファイル(詳しくは後述)で、その上に重ね合わせるデータをcsv、もしくは別のtopojsonファイルを用意します。

重ね合わせ可能なデータ

以降に個別のグラフ画像と定義のjsonファイルなど一式をリストしていきますが、重ね合わせ可能なデータの形式として以下があります。

点: 経度と緯度の座標で定義
線: 経度と緯度と順序、そしてグループを示すデータ(色などに充てる)で定義
面: topojsonファイル内に定義、topojsonファイルの上にtopojsonファイルを重ね合わせる
テキスト: 経度と緯度の座標で定義
塗り: 塗り色を示すデータと、下地のデータを結合キーを通じてつなぎ合わせる

また、色やサイズを値に応じて変える例も用意しました。色やサイズを変える基準となる値は質的変数(nominal)を利用して分ける場合と、量的変数(quantitative)を用いてグラデーションで分ける場合があります。それから下地に利用している面データ(都道府県境界のポリゴン)に応じて塗分けているケースですが、これは、下地のデータと重ね合わせるデータのキーを合わせて、結合した結果を用いています。ほかのデータは座標だけ同期して上に乗っているだけですが、下地自体を塗り分ける場合は、データを結合し、結合先にある値を色分けの対象として定義する必要があります。

topojson形式と利用データファイル

Vega Liteで使う下地の地図画像ですが、通常使われるシェープファイル(.shp)ではなく、topojsonというjson形式を使います。色々調べるとgeojsonという形式があり、topojsonを作成するにはシェープファイルをまずはgeojsonに変換し、さらにそれをtopojsonに変換するとのこと。面倒そうなので出来合いのものを探しました。日本地図で、行政区域だけ表示された白地図で、都道府県版と市区町村版で以下が公開されているので、ありがたく利用させていただきます。いずれも低解像度の最新(一番下)をダウンロードしてきました。gistにも再掲しておきます。

都道府県境界

市区町村境界

また、都道府県ごとに分解したものも探しました。こちらが便利です。gistにはサンプルに利用した08(茨城県)のみ再掲してあります。

各サンプルを見ていきましょう。データとして利用しているcsvファイル、topojsonファイルは共通のものが多いため、最後に一式リストします。

白地図、都道府県境界

まずは白地図をそのまま表示します。

白地図、市区町村境界

同じ形式ですが境界が市区町村区画です。

白地図、一部分拡大

都道府県境界の一部分を拡大したものです。scaleとcenterのパラメーターでどのくらい拡大するか、そしてどこを中心にするかを決定します。

点の描画

単純に点を配置したものです。色は勝手に分けてくれますが、指定したければ後述のサンプルをご覧ください。

点のサイズ

点のサイズを列情報から与えています。

点の色、質的変数

色を指定します。質的変数として指定しています。値が数値であってもnominalと指定すると質的変数として扱ってくれます。

点の色、量的変数、およびテキスト

同じ色指定ですが、量的変数としてグラデーションの色指定を行っています。あとタイトルをつけたいときはこんな感じで。この例は点とテキストですが、点と線や線と面などの複数レイヤーを組み合わせる際はこのように下から上に記載をしていきます。

都道府県別白地図

下地の白地図を変えました。茨城県。

線の描画

緯度経度座標と順序の列、それから複数の線を描く際はグループ列が必要です。例えば台風の進路なら時系列データが描画順序になるかと。それから拡大、中心移動の設定をする際は、拡大サイズ(scale)、そして中心位置(center)パラメーターを与える必要があります。これは重ね合わせた各データのレイヤーそれぞれに定義が必要で、なおかつ同じ値にする必要があるため注意が必要です。そうしないとオブジェクトの座標位置がずれてしまいます。