マガジンのカバー画像

IT・プログラミング

4
運営しているクリエイター

#地図

マイマップにホバー効果を追加

マイマップにホバー効果を追加

前回作ったMaplibre GL JSのマイマップにホバー効果を追加しました.少し難しかったため,ブログ上でやり方を整理しました.触ってみたい方は

githubのリンクに飛んでください.

ホバー効果 (hover effect) とは?ホバー効果は,マウスを線・面の上に重ねたときに,線と面の範囲を分かりやすく表示する機能です.次の例では,中央線の上にカーソルを乗せたときにホバー効果です.中央線

もっとみる
百名山の位置と登山記録を可視化

百名山の位置と登山記録を可視化

完成した地図地図1:

地図2:

どうやって地図を作る?MapLibre GL JS(地図ライブラリ)

GPS情報付きの写真(スマホで撮影)

トラックデータ(10分おきの位置情報,ジオグラフィカというスマホアプリで記録&出力)

MapLibre GL JSというブラウザ上で機能するライブラリを選んだ理由を簡単にまとめます.候補は

Python or Rなどで画像ファイルとして地図を作る

もっとみる