地図上で「緑が多くて歩きやすい道」が見えるようになりました！
はじめに
こんにちは、うに君とニワトリさんです。ナビタイムジャパンで地図フレームワークの研究開発を担当しています。
本日、当社のウォーキングアプリ『ALKOO by NAVITIME』から「並木道マップ」をリリースしました！
並木道マップでは「自然の緑が多い道」を地図上で確認することができ、炎天下でもできる限り暑さを避けて移動・運動するための判断材料として活用いただけます。
開発経緯
昨年の夏、同じく当社のウォーキングアプリ『ALKOO by NAVITIME』から「日陰マップ」をリリースしました。
日陰マップでは建物の陰がどの方角に伸びているのかを地図上で確認することができ、日陰が多い道を優先して歩けるようになります。
この機能はメディアでも多数取り上げていただき、炎天下でもできる限り暑さを避けて移動したい利用者のニーズがとても高いことがわかりました。
同時に、「建物以外の日陰の情報も見たい！」という声を社内外からいただくようになりました。
私達は2022年の11月頃から検討を始めて、炎天下の移動・運動を助ける機能の第2弾として「日陰マップと併せて使える、並木道マップ」を開発することにしました。
樹木の陰を歩いて暑さを避けられるようになるのはもちろんですが、自然の緑が多い道では単純な日陰の有無以上に涼しさ・心地よさも感じられるのではないかと考えています。
「緑が多い道」をデータ化する
データを自作した経緯
ここからは「緑が多い道」を地図上で表示するまでの流れを紹介します。
まず、「緑が多い道」を地図上で表示するためには、『緑が多い道』のデータを作って配信する必要があります。
だれでも自由に使えるオープンデータにも樹木が生えている座標のデータは含まれていました。
しかし、データの網羅率・信頼性に不安があったり、日陰ができるような大きな木が生えているのか判断できなかったりと、そのままプロダクトに転用するためには懸念点も多くありました。
そこで私達は、ナビタイムジャパンが既に提供しているデータをうまく組み合わせて、「緑が多い道」データを自作することにしました。
具体的には「① 機械学習モデルを使って航空写真から緑地・樹木の座標を推論」して、「② 経路探索で使うネットワークデータと照合」することにしました。
① 航空写真から緑地・樹木の座標を推論する
航空写真から緑地・樹木の座標を推論するにあたって、米国Meta社製の機械学習ライブラリである「Detectron2」を活用することにしました。
「Detectron2」を使うと、画像のセグメンテーション (領域分割) に特化した推論モデルを構築できます。
推論モデルを構築するために、まずは人間が目視で画像中の緑地・樹木の位置をひたすらアノテーションして、学習用データを作っていきます (これを教師データと呼びます)。
ある程度まとまった量の教師データを作ったら、機械に教師データを読み込ませて推論モデルを教育していきます。
推論モデルに教師データを読ませるとき、どのくらいの回数繰り返して読ませるか、どのくらいの領域に分けて読ませるか、どのくらいの枚数ずつまとめて読ませるか、などを少しずつ調整しながら何度も何度も繰り返し学習させます (この作業をハイパーパラメーターチューニングと呼びます)。
うまく学習が成功して推論モデルができあがると、初めて読み込ませた画像であっても正確に目的の領域を抽出してくれるようになります。
② 経路探索で使うネットワークデータと照合する
航空写真から推論したデータをそのまま地図上に描画するのは不適切です。
なぜなら機械学習モデルが自動生成したデータにはどうしてもノイズが含まれますし、現実の緑地・樹木の輪郭をそのまま地図上に描画しても、地図を見る人に雑然とした印象を与えてしまう可能性が高いためです。
私達は推論した並木道データを「経路探索で使うネットワークデータ」と照合して、見せる樹木の情報量を整理することにしました。
ネットワークデータには自動車や人間が辿る経路の形状も含まれます。
この形状に沿った座標の周辺に絞って緑地の存在有無を判定していくことで、地図上で歩道に沿って整然と樹木が並ぶようになり、建物や道路と樹木が重なって地図が読みにくくなる症状も防げるだろうと考えました。
データの照合は上に掲載した3枚の画像の流れに沿って実施します。
まず、歩道の形状に沿って等間隔の円を配置します (①)。
続いて、推論モデルを使って航空写真から緑地領域を検出します (②)。
最後に、配置した円と緑地領域が重なった面積を計測して、各地点の最終的な緑地レベルとして扱います (③)。
緑地レベルが0ならその地点の周囲に樹木は存在せず、緑地レベルが2~3なら比較的大きな緑地・樹木が存在する、という理屈です。
このような試行錯誤を経て、無事に「緑が多い道」のデータを作ることができました！
「緑が多い道」を地図上で表現する
データはできた！じゃあ表現は…？
データがある程度できた段階で、並行して見せ方の検討も始めました。
みなさまにお届けしている並木道マップでは、縮尺によって3Dオブジェクトまたは線状で表現しています。
しかし初めからこの表現が決まっていたわけではなく、何度か検討を重ねてここに至っています。
実は当初のアイデアでは、緑地レベルに応じたサイズの円を各座標に置くというヒートマップのような表現を考えていました。
ただ、地図に限った話ではありませんが、実際に目に見える形になると想定していなかった問題が見えてきた…ということは少なくありません。
というわけでまずは既存機能の表現を使い回せる範囲でプロトタイプを開発することにしました。
わかりやすさのため少々強調した画像を用意しましたが、ヒートマップで表現した場合はこのような見栄えになりました。
[右]樹木ということが伝わりにくい（拡大すると特に）という課題が見えた
プロトタイプを作成したことにより、並木道マップの要件が見えてきました。
・あくまで付加情報なので、地図の見やすさは担保すべき
・なるべく樹木ということが直感的にわかるようにしたい
これらの要件を同時に満たす表現は…と考えると難しいですが、地図の場合縮尺によって情報量も違います。
樹木もそれに応じ、縮尺によって異なる表現にすることにしました。
また"見やすさ"は個人の主観によるところもありますが、今回は徒歩移動というシチュエーションが決まっていたため、徒歩移動のとき利用者が地図で何を見たいか？という観点で考えることにしました。
こういった観点を念頭に「プロトタイプ改善→社内でのフィードバック」を繰り返すことで、徐々に表現の方針が固まりました。
【日陰を表示している縮尺】
・日陰 / 3D建物に合わせ、樹木も直感的にわかるような表現にしたい
→3Dオブジェクトを描画。緑地レベルは大きさで表現
・地図の情報を見たいとき邪魔にならないようにしたい
→拡大するにつれ透明度をUP
【少し縮小した縮尺】
・地図の情報に合わせ、樹木の情報も「だいたいどのあたりの道沿いに樹木があるか」程度の粒度にしたい
→線状で表現
※ 更に縮小した縮尺では樹木の位置を確認したいケースは稀ではないか、ということで地図の見やすさを優先し非表示にすることに
表現の方針が決まったあとも、
・デザイナーと相談しながら3Dオブジェクト・線それぞれの見た目を調整
・データ側のブラッシュアップ
などを繰り返し完成に至りました。
見せ方にもこだわった並木道マップが、実際にどのような使用感になっているのか…
ぜひ『ALKOO by NAVITIME』をダウンロードいただき、ご覧ください！
おわりに
並木道マップの機能は、このnoteを公開した時点で関東圏のみ提供しています。
今後も利用者のニーズを見極めつつ、各地方の主要都市にも提供エリアを拡大できないか、引き続き検討を進めていきます。
また、航空写真から推論できるデータは緑地・樹木以外にもアイデア次第で無限の可能性がありそうです。
ナビタイムジャパンの各種サービスから「ご意見」を投稿できますので、どのような機能があったらうれしいか、ぜひみなさまのお声をきかせてください！
最後までお読みいただきありがとうございました！