緯度経度などのデータファイルから，マーカーとイメージポップアップ付きの OpenStreetMap 地図を生成

問題定義

提案技術

期待される効果 簡易に構築運用可能な地図サービスシステム構築 ●こんなことでお困りではありませんか？　・モバイル端末等で日々データを収集している。地図に表示させたいが。何とか素早く、確実に、安価にできないものか？　・自ら（エンドユーザ）で、地図システムの中身を掌握しながら開発を進めたい．従来型システム開発（提案→仕様策定→実装→テスト）では間に合わず、よりクイックに開発したい ●こんなことができる、こんな用途が考えられます　モバイル端末（GPS付きも可能）で集めた緯度・経度付きの情報を、即時に、地図に一括表示．　地図に基づくあらゆる情報で、パーソナル、特定業務用途の性質をもつもの　　・ヒアリハット地図　　・道路等の検査、調査結果（交通状況、道路付帯施設状況など）　　・団体行動などの把握 ●システム構成 ●使用している既存の技術　拡張可能です：密度表示、住所やゲオコードとの変換簡易なデモページ：

前準備

Python 3.12 のインストール

以下のいずれかの方法で Python 3.12 をインストールする。

方法1：winget によるインストール

Python がインストール済みの場合、この手順は不要である。管理者権限のコマンドプロンプトで以下を実行する。管理者権限のコマンドプロンプトを起動するには、Windows キーまたはスタートメニューから「cmd」と入力し、表示された「コマンドプロンプト」を右クリックして「管理者として実行」を選択する。

winget install -e --id Python.Python.3.12 --scope machine --silent --accept-source-agreements --accept-package-agreements --override "/quiet InstallAllUsers=1 PrependPath=1 AssociateFiles=1 InstallLauncherAllUsers=1"

--scope machine を指定することで、システム全体（全ユーザー向け）にインストールされる。このオプションの実行には管理者権限が必要である。インストール完了後、コマンドプロンプトを再起動すると PATH が自動的に設定される。

方法2：インストーラーによるインストール

Python 公式サイト（https://www.python.org/downloads/）にアクセスし、「Download Python 3.x.x」ボタンから Windows 用インストーラーをダウンロードする。
ダウンロードしたインストーラーを実行する。
初期画面の下部に表示される「Add python.exe to PATH」に必ずチェックを入れてから「Customize installation」を選択する。このチェックを入れ忘れると、コマンドプロンプトから python コマンドを実行できない。
「Install Python 3.xx for all users」にチェックを入れ、「Install」をクリックする。

インストールの確認

コマンドプロンプトで以下を実行する。

python --version

バージョン番号（例：Python 3.12.x）が表示されればインストール成功である。「'python' は、内部コマンドまたは外部コマンドとして認識されていません。」と表示される場合は、インストールが正常に完了していない。

AIエディタ Windsurf のインストール

Pythonプログラムの編集・実行には、AIエディタの利用を推奨する。ここでは、Windsurfのインストールを説明する。

Windsurf がインストール済みの場合、この手順は不要である。管理者権限のコマンドプロンプトで以下を実行する。管理者権限のコマンドプロンプトを起動するには、Windows キーまたはスタートメニューから「cmd」と入力し、表示された「コマンドプロンプト」を右クリックして「管理者として実行」を選択する。

winget install -e --id Codeium.Windsurf --scope machine --accept-source-agreements --accept-package-agreements --override "/VERYSILENT /NORESTART /MERGETASKS=!runcode,addtopath,associatewithfiles,!desktopicon"
powershell -Command "$env:Path=[System.Environment]::GetEnvironmentVariable('Path','Machine')+';'+[System.Environment]::GetEnvironmentVariable('Path','User'); windsurf --install-extension MS-CEINTL.vscode-language-pack-ja --force; windsurf --install-extension ms-python.python --force"

【関連する外部ページ】

Windsurf の公式ページ: https://windsurf.com/

必要なPythonライブラリのインストール

以下のコマンドを管理者権限のコマンドプロンプトで実行する（手順：Windowsキーまたはスタートメニュー → cmd と入力 → 右クリック → 「管理者として実行」）。
以下のコマンドを実行し，必要なライブラリをインストールする．
```
pip install -U pandas folium
```

【関連する外部ページ】

Python公式サイト：https://www.python.org/

【サイト内の関連ページ】

Python詳細ガイド：別ページ »

緯度経度を含むデータファイルの準備

カレントディレクトリの確認

Python プログラムの実行

Windows では python （Python ランチャーは py）
Ubuntu では python3

【サイト内の関連ページ】 Python のまとめ: 別ページ »

次の Python プログラムを実行
```
import os
print(os.getcwd())
```

AjinKuriakose/UK-Road-Accident-Data-Analysis のデータ

GitHub の AjinKuriakose/UK-Road-Accident-Data-Analysis の Web ページを開く
https://github.com/AjinKuriakose/UK-Road-Accident-Data-Analysis
「clean_data.csv」をダウンロードしたいので、クリック．
画面が変わる．「Download」をクリック
先ほど調べた「カレントディレクトリ」にダウンロードロードしたファイルを置く
* ファイルの先頭部分は次のようになっている

データファイルの緯度経度などを使っての表示

import pandas as pd
import folium
datafile = "clean_data.csv"
lat, lon = 53.44, -2.24
zoom_start = 16
webfile_name = "d.html"

m = folium.Map(location=[lat, lon], zoom_start=zoom_start)
X = pd.read_csv(datafile)
for index, r in X.iterrows():
    if index < 100:
        p = '<a href="https://maps.google.com/maps?q=&layer=c&cbll=%f, %f&cbp=11,0,0,0,0">%s <br/></a>' % (r.latitude, r.longitude, r.date)
        folium.Marker([r.latitude, r.longitude], popup=p).add_to(m)

m.save(webfile_name)

先ほど調べた「カレントディレクトリ」に d.html ファイルができるので Web ブラウザで開いてみる．地図が表示されれば OK．

ズームアウトして確認

マーカーはクリッカブル