Download as PDF, PPTX
Uploaded byNoriko Takiguchi
あなたのお勧めマップ作ってみよう！ OpenStreetMap活用編 uMap
「uMap」を用いたマップ作成について OpenStreetMap からのデータ抽出：Overpass API について、overpass turbo のウィザードでの使用方法 関西オープンフォーラム 2018 発表資料 ※補足：ポップアップ内への画像表示 「概要」項目に、画像への外部リンクを記載しています。 Wikimedia Commons にアップした画像のサムネイルを使用しています。 ＜「概要」項目への記載例＞ 前方後円墳 古墳時代前期（４世紀前半） {{https://upload.wikimedia.org/wikipedia/commons/thumb/1/13/TeradoOtsukaKofun_nt_1.JPG/320px-TeradoOtsukaKofun_nt_1.JPG}}
More Related Content
![Unity 2018-2019を見据えたDeNAのUnity開発のこれから [DeNA TechCon 2019]](https://cdn.slidesharecdn.com/ss_thumbnails/techcon2019harutootake-190218063853-thumbnail.jpg?width=640&height=640&fit=bounds)
![[NDC 2016] 유니티, iOS에서 LINQ 사용하기](https://cdn.slidesharecdn.com/ss_thumbnails/ioslinq-160429152640-thumbnail.jpg?width=640&height=640&fit=bounds)
Similar to あなたのお勧めマップ作ってみよう！ OpenStreetMap活用編 uMap
あなたのお勧めマップ作ってみよう！ OpenStreetMap活用編 uMap
- 1. 関西オープンフォーラム 2018 2018/11/10 NorikoTakiguchi OSM Mapper : taki3hira Programmer Noriko Takiguchi OSM Mapper : taki3hira Programmer Noriko Takiguchi OSM Mapper : taki3hira Programmer あなたのお勧めマップ 作ってみよう！ ～ OpenStreetMap活用編 uMap ～
- 2. 2 uMap とは Open Sourceです！(WTFPL ラインセンス) Django (Python) and Leaflet (JavaScript) サイト埋め込み用地図が即座に作成できます！ 背景地図・複数のレイヤ マーカー（ポイント）・ライン・ポリゴン アイコン・色・透明度・形状の設定 ポップアップオプション設定 データのインポート サイトへのマップ埋め込みと共有 ヘルプ機能あり https://wiki.openstreetmap.org/wiki/JA:UMap サンプル 見てみよう
- 3.
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18. 18 uMap Help 機能製品版インスタンス 各所に Help 機能あり
- 19. 19 各地物等の登録時 個別の値を設定 uMap マップ設定を編集 製品版インスタンス マップ全体の デフォルト値を設定 マーカー ライン ポリゴン レイヤの登録時 レイヤ別の デフォルト値を設定
- 20.
- 21.
- 22.
- 23.
- 24. 24 uMap マーカーの色変更 製品版インスタンス 変更後の色 Redを選択 シェイプ表示プロパティ ５ 「色」横の「指定」をクリック ４
- 25.
- 26. 26 ● 円形 ● まち針 uMapアイコン形状変更 製品版インスタンス アイコン形状 しずく型選択 シェイプ表示プロパティ ７
- 27. 27 uMap アイコンシンボル変更 製品版インスタンス アイコンシンボル hospital選択 シェイプ表示プロパティ ８ 「シンボル変更」ボタン クリックで反映 ９ １０「保存」ボタン クリック
- 28.
- 29.
- 30. 30 uMap ラインを描画 製品版インスタンス 破線表示：5,15 ●線の色 ● 線の太さ ● 線の透明度 シェイプ表示プロパティ
- 31.
- 32.
- 33.
- 34.
- 35. 35 データのインポート（静的） Overpass API 使用：Overpassturbo http://overpass-turbo.eu/ 1. OpenStreetMap からデータ抽出 データ検索用クエリ作成 クエリ実行 → 地図上の抽出表示確認 GeoJSON 形式でエクスポート 2. uMap へのインポート 取得した GeoJSON をインポート カスタマイズ情報を追加 タイトル・説明・画像・リンク マーカーの種類・色 ウィザード 使ってみよう
- 36. 36 uMap データインポート 製品版インスタンス sport.geojson 「インポート」ボタン クリックで実行 GeoJSONファイルを 選択する ● インポートデータ形式 ● geojson ● インポート対象レイヤ ● スポーツセンター
- 37.
- 38. 38 uMap 追加インポート 製品版インスタンス アイコン形状 シンボルを変更 マーカーホバー時に 名称表示 図書館情報も同様に geojson インポート
- 39.
- 40.
- 41. 41 Overpass API 使用：Overpassturbo http://overpass-turbo.eu/
- 42.
- 43.
- 44. 44 データ抽出：クエリ作成 クエリウィザード → クエリ作成 クエリ作成 ボタンをクリック 対象地物のタグを入力 →（次ページ） 画面左側にクエリ表示 ※例（スポーツセンター） leisure=sports_centre Overpass turbo
- 45.
- 46.
- 47. 47 データ抽出：クエリ実行 作成済クエリ → 実行→ 抽出地図表示 実行 ボタンをクリック Overpass API 使用：Overpass turbo
- 48. 48 データ抽出：GeoJSON 取得 エクスポート →抽出データの取得 エクスポート ボタンをクリック データ：GeoJSON ● ダウンロード or コピー → uMap インポートで使用 Overpass API 使用：Overpass turbo
- 49. 49 Happy Mapping ! OpenStreetMap まち歩きでの発見 マップに反映 マッピングパーティ オープンデータソン ウィキペディアタウン ごく日常の生活の中でも！ NorikoTakiguchi noriko.taki3@gmail.com https://wiki.openstreetmap.org/wiki/User:Taki3hira ともに学びましょう OSMについてのご質問など いつでもお気軽に！ 継続は力なり uMap 使ってみよう