foliumで地図を表示するアプリをherokuにデプロイする

大まかな流れ

1. foliumでhtmlを生成

• herokuにアップロード

下記を参考にさせていただきました。

foliumでhtmlを生成

地図を描画する最低限のプログラム

import folium

# 近鉄四日市駅の緯度経度
lat_lng = [34.967122324836694, 136.61851365521244]

f_map = folium.Map(
    location= lat_lng, 
    zoom_start=16
)

f_map

下はJupyter Labで実行した結果です。

Google Mapから緯度経度を取得

上の例では近鉄四日市駅の周辺を表示しました。
foliumで地図を表示するにあたって事前に表示したい位置の緯度経度を取得しておく必要があります。

下のようにfoliumで表示したい位置をGoogle Mapで検索して右クリックすると緯度経度を取得できます。

ピンを表示

# 駅にピンを立てる
folium.Marker(
    location=lat_lng,
    icon=folium.Icon(icon='info-sign', )
).add_to(f_map)

# 周辺の１箇所にピンを立てる

lat_lng_2 = [34.96750038330007, 136.62012298060858]

folium.Marker(
    location=lat_lng_2,
    icon=folium.Icon(color='red', icon='home', )
).add_to(f_map)

# herokuへのアップロードに向けてhtmlで保存する
f_map.save('map.html')

heroku

３つのファイルを一つのフォルダに保存

• index.php
• composer.json
• map.html

index.phpとcomposer.jsonを作らないといけませんが、すごくシンプルです。

index.php

<?php include_once("map.html"); ?>

composer.json

{}

コマンド

git init
git add .
git commit -m 'Initial commit'
git push heroku master
git open

foliumを触ってみて。

地図を埋め込んだwebアプリを作りたい、という話だったら他のやり方の方が早いかなと。
分析っぽいことをするなら便利そう。