写真を入れたら、旅が地図になり始めた
前回、「写真だけで旅の記録が完成するMAPアプリ」を作ろうと思い立ち、
TraceMap（仮）の開発をスタートしました。
今回ついに、
“旅アプリっぽさ”
が一気に出てきました。
⸻
今回やったこと
Google Maps を実際に表示
まずは Google Cloud Console から APIキーを取得して、
React + TypeScript + Vite 環境で Google Maps を表示。
最初は真っ白画面とエラー祭り。
API有効化忘れ、
Referrer制限、
.env 読み込み…。
Mapが表示された瞬間だけで普通にテンション上がりました。
⸻
GPS付き写真をそのまま地図へ配置
今回かなり大きかったのがここ。
写真の EXIF 情報から GPS を取得して、
「撮った場所にそのままピンを立てる」
ところまで実装。
旅行中って、
意外と “どこ行ったか” を忘れる。
でも写真にはGPSが残ってる。
つまり、
入力しなくても旅ログは作れる。
これが今回一番面白かった部分です。
⸻
GPSがない写真問題
ただ、全部の写真にGPSが入ってるわけじゃない。
スクショ、
保存画像、
加工後画像とかは位置情報が消えてたりする。
なので、
検索して場所を選択できるようにした
これを追加。
結果として、
- GPSあり → 自動配置
- GPSなし → 手動で場所選択
の両対応になりました。
この仕様にしたことで、
「実際に使える感」がかなり増した気がします。
⸻
現在地機能も実装
Mapを開いた瞬間に、
「自分が今どこにいるか」
という機能はMapにおいて不可欠なものだと感じたので表示されるようにしました。
旅先でそのまま写真を追加していく流れも見えてきたので、
アプリのイメージがかなり具体化してきました。
⸻
今回一番感じたこと
“地図に写真が置かれる”
これだけで、
ただの画像フォルダが一気に「旅の記録」になる。
Google Photosとも、
Instagramとも違う感覚。
「旅を思い出すUI」
って結構可能性あるなと感じています。
⸻
次やりたいこと
次は実現したらかなり面白そうな機能。
Journey Replay（旅再生）
撮影順に、
- Mapが移動
- ルート線が伸びる
- 写真が切り替わる
ことで、
「旅を再体験できる」
ようにしたい。
ここまで行くと、
普通のMAPアプリじゃなくなりそう。
⸻
少しずつだけど、
“使いたくなる体験” に近づいてきた気がします。