HackMD
[チームI] Tokyo OSS Party!! 2021 記録シート
チーム
- チーム名: Ruby が好き
- メンバー
- Slack チャンネル: #2i-準拠ハザードマップ
取り組む課題
八王子市「デジタルハザードマップ」
課題に対するアプローチ
「（課題）市区町村には紙での配布を前提とした PDF のハザードマップしかない問題」を解決するために、
「（技術）Web 地図」と「（データ）ハザードマップポータルサイトや市区町村のデータ」を使い、
「（対象）市区町村のハザードマップ担当、または、市区町村民」に対して、
「（方法）Web ハザードマップテンプレートを提供」をして、
「（結果）容易に Web ハザードマップを作成・公開できる」ようにする。
開発したサービス
サービス名
shikuchoson-hazardmap-template (市区町村ハザードマップテンプレート)
URL
- GitHub repo: https://github.com/sankichi92/shikuchoson-hazardmap-template
- テンプレートの利用例: https://sankichi.net/hachioji-hazardmap/
- 発表資料: https://speakerdeck.com/sankichi92/shikuchoson-hazardmap-template
背景と課題
日本のハザードマップは、国土交通省の管理するハザードマップポータルサイトにまとめられており、そこでは以下の2つのサービスが提供されています。
- 重ねるハザードマップ: 災害リスク情報や防災に役立つ情報を、全国どこでも重ねて閲覧できるWeb地図サイト
- わがまちハザードマップ: 市町村が作成したハザードマップを見つけやすくまとめたリンク集
「重ねるハザードマップ」は Web 地図として多機能で非常によく作りこまれていますが、その使い方でも
詳細を確認する場合は市町村が作成したハザードマップをご覧ください。
とあるとおり、あくまで国の作成した地図であり、市区町村ごとの詳細は確認できません。
ハザードマップに求められるのは、多くの場合、国全体の広く浅い情報ではなく、自身の住む場所ピンポイントの狭く深い情報です。
そうした情報を確認するには、「わがまちハザードマップ」から市区町村のハザードマップを確認する必要があります。
しかし、市区町村の作成するハザードマップの多くが紙での配布を前提としており、重ねるハザードマップとちがって Web に最適化されていません。
そしておそらく、独自の Web ハザードマップを開発・運用できるほど、予算やリソースに余裕のある市区町村は少ないでしょう。
この課題に対し、本サービスは、市区町村の単位で Web ハザードマップを容易に作成・カスタマイズできるテンプレートを提供します。
合わせて、テンプレートに GitHub を活用することで、GitHub Pages による公開、Pull Request による市民参加も可能とします。
ターゲット
- ハザードマップを Web で提供したいと考えているが、予算やリソース等の問題でなかなか実行に移せない市区町村職員
- 紙のハザードマップに不満を持っている市区町村民
利用した技術とその特徴
- Create React App: SPA (Single-page application) を簡単に開発するためのツール
- Leaflet: 広く普及している Web 地図ライブラリ
- GitHub Pages: 静的ウェブサイトをホストするための GitHub の機能
利用したデータ
- 地理院タイル
- OpenStreetMap（API で市区町村の行政界を得るため）
- ハザードマップポータルサイトの配信データ
- 八王子市提供データ
サービスの内容
以下の手順で、特定の市区町村のハザードマップを作成・公開できます。
- sankichi92/shikuchoson-hazardmap-template の "Use this template" からリポジトリを作成
hazardmap-config.jsoncの都道府県・市区町村の設定を変更してコミット- GitHub Actions で自動的にビルドが走り
gh-pagesブランチが作成される
- GitHub Actions で自動的にビルドが走り
- リポジトリの設定から GitHub Pages をオンにして Web 地図を公開
また、以下のようなカスタマイズも可能です。
csvディレクトリ以下に特定のフォーマットの CSV ファイルをアップロードしてレイヤ（Point Features）を追加imagesディレクトリ以下に画像をアップロードして地図上に表示
使い方の詳細は README https://github.com/sankichi92/shikuchoson-hazardmap-template#使い方 や以下のデモ動画を参照してください。
Learn More →
将来的には、他の種類のレイヤ追加等のカスタマイズも視野にあります。
課題と解決に関わるステークホルダーとその役割
平常時
- 市区町村職員
- テンプレートを使用した Web ハザードマップの公開
- CSV や画像によるデータ提供（＝オープンデータ化）
- 市区町村民
- 紙のハザードマップではできない地図の拡大・縮小やレイヤの表示・非表示による、身の回りで起こりうる災害の詳細な確認
- Pull Request によるデータや機能の修正・改善
災害時
- 市区町村職員
- ハザードマップへの迅速な情報反映
- 市区町村民
- リアルタイムな情報の確認
サービスによって課題が解決された世界のイメージ / サービスが実際にターゲットに届き活用されるまでのストーリー
市区町村職員
- 職員「隣の市で Web ハザードマップが好評らしいです。我が市でもやりましょう！」
- 上司「すでにちゃんとした紙のハザードマップがあるだろう。同じようなものを作るのに割く予算もリソースもない！」
- 職員「いえ、予算もリソースも必要ありません。隣の市でも使っている OSS の shikuchoson-hazardmap-template を使えば、すでにデータもあるし、30分もあれば公開できます！」
- 上司「なんだって〜！ 紙の地図を作るより簡単じゃないか。ぜひやってみよう」
市区町村民
- 市民A「引越してきた時に紙のハザードマップもらったけど、小さくて自分の家も見つけられないし、ゴチャゴチャ情報が多くてよく分からなかったんだよね」
- 市民B「それならついこないだ公開された Web ハザードマップを見るといいよ。拡大・縮小できるし、情報の表示・非表示もできて見やすかった。ほらこれ」
- 市民A「なんだって〜！ しかもこれ、前に住んでた町と同じ UI で馴染みがある。……あれ、でも警察署の住所が移転前のままだ」
- 市民B「本当だ。それなら自分たちの手で修正しよう！ この地図は GitHub で公開されていて、Pull Request も受け付けているの」
- 市民A「Pull Request なら任せて！（ｶﾁｬｶﾁｬｶﾁｬ…ｯﾀｰﾝ!）」
