地域メッシュビュアー作りました

この記事は、 GO Inc. Advent Calendar 2023 の11日目です。

次世代事業本部データビジネス部でデータエンジニアをやっている鳩です。

地域メッシュの場所を検索したくなることありませんか？私はあります。 そこで地域メッシュビュアーを作りました。

地域メッシュは、経度・緯度に基づき日本の地域を網の目に分けたものです。分けられた地域ごとにコードが採番されています。

最近、そんな地域メッシュを閲覧したりコード検索したくなる機会が個人的に増えてきており、Webツールとして仕立ててみました。ぜひご活用ください！

https://goinc-oss.github.io/mesh-viewer/

技術要素紹介

地図表示

地図表示には、オープンソースな地図表示ライブラリのLeafletを使っています。業務でも採用しておりお気に入り。

メッシュコード <-> 緯度経度変換

メッシュコードを描画するには、四隅の緯度経度を計算する必要があります。その計算は、総務省が公開しているメッシュコードの採番方法を参考に独自に実装してます。

描画高速化の工夫

二次メッシュ(約10km四方)は5,000個近くあり、何も考えずに全メッシュ描画するともっさりしてしまいます。そこで、画面の四隅の座標に包含されるメッシュを計算し、そのメッシュのみ描画することで必要最低限の処理量で済むように工夫しています。

ホスティング

静的なサイトなのでGithub Pagesでホストしています。mainブランチにマージされたソースをWeb公開する設定にしています。こうしたライトなWebツールのホスティングにおいては、Github Pagesは楽ちんで良い感じです。

We're Hiring!

興味のある方は 採用ページ も見ていただけると嬉しいです。

Twitter @goinc_techtalk のフォローもよろしくお願いします！