Maplatの最新状況 –流行りのGTFSともコラボしてみた– 神戸バージョン

Maplat FOSS4G Kobe 発表

Transcript

1. Maplatの最新状況
   –流行りのGTFSともコラボしてみた–
   大塚 恒平 – Code for History
   1
   

   View Slide

2. 目次
   • 発表者紹介
   • Maplatとは
   • 座標変換の手法（同相変換保証）
   • 線から線への変換
   • EcmaScriptモジュール化
   • 他技術との比較
   • Maplatの適用例
   • 今後の展開（2018年の進捗状況確認）
   2
   

   View Slide

3. 発表者紹介
   3
   

   View Slide

4. • 大塚 恒平
   • エンターテイメント系位置情報ビジネスで 15 年
   • マピオン社（現ワンコンパス社）- 位置情報ゲーム「ケータイ国盗り合
   戦」の立ち上げに参加。ゲームシナリオ作成やプログラム実装など、企画
   と技術双方のディレクターとして活躍。
   • ATR-Promotions 社（現 Stroly 社）- スマホ向け古地図アプリの立ち上げに参
   加。プログラム実装や特許技術開発など、企画と技術双方のディレクター
   として活躍。
   • 現在は HERE Technologies 社において、地図コンテンツとプラットフォーム
   双方の営業サポートエンジニアとして勤務。
   • 余暇ではボランタリーに、本発表で取り上げる Maplat の開発を含む
   オープンデータ、オープンソースの活動を行なっている。この8月、新た
   な Code for Japan の非地域ブリゲートとして Code for History を立ち上
   げた。 4
   

   View Slide

5. Code for History
   • MaplatはCode for Naraの元で誕生
   • 製作者が関東に移ってもCode for Naraの下に間借
   りしていたが、出て行けとそろそろちゃんとし
   た方がいいかなと思いCode for Historyとい
   う団体を立ち上げた
   • 特に行動実態はない
   • 絶賛参加募集中！もれなく会員になれます！
   5
   

   View Slide

6. Maplatとは
   6
   

   View Slide

7. 古地図や絵地図を使って街歩きを楽し
   める地図ビューア技術 7
   © OpenStreetMap © Utouto Tanken-tai
   

   View Slide

8. 既存の GIS を用いて古地図や絵地図を
   扱う際の問題点 (1)
   • 古地図や絵地図は地域の魅力が詰まっているので、観光や教育用途に
   とても有用なはず、しかし…
   • 歴史的素養の少ない一般の人にとって、古地図を読み解いて現在の街
   並みと照らし合わせるのは至難の技
   • 既存の GIS は古地図を現在地図に重ね合わせることはできるが、古地
   図の側を酷く歪めてしまい、その持つ魅力を半減させてしまう
   8
   

   View Slide

9. 既存の GIS を用いて古地図や絵地図を
   扱う際の問題点 (2)
   • 既存の GIS が古地図を歪めてしまうサンプル
   9
   

   View Slide

10. Maplat は古地図を歪めずに正確な地図
    の上に重ねることを実現しました 10
    

    View Slide

11. 11
    座標変換処理をサーバサ
    イドから、クライアント
    サイドリアルタイムに：
    画面の中心点では、常に
    古地図と現代地図の位置
    が合うようにする
    大まかに中心点周りの方
    角と縮尺比を計算し、そ
    れに合わせ古地図全体が
    大まかに重なるように見
    せかける
    

    View Slide

12. 座標変換の手法
    （同相変換保証）
    12
    

    View Slide

13. 同相変換とは
    • どんな地図の間でも、同じ
    点を連続変換すれば必ず同
    じ場所に戻り、かつ隣の点
    と連続することが保証
    • 地図の内部だけではなく、
    地図外の座標領域含め一意
    に相互変換
    • ただし、データのトポロ
    ジーエラーが解決されてい
    る事が必要（エラーの有無
    はMaplatEditorで判定可能）
    • 既存GISの技術蓄積を継承
    13
    

    View Slide

14. 全単射？同相？
    • FOSS4G 2019 Niigataまでは「全単射
    （bijective）」に対応していると主張していた
    • 国土地理院のえらいひと（鎌田参事官）から、
    「全単射だけでなく同相（homeomorphic）も
    実現してるから、そう主張した方がいいよ」
    とアドバイスをいただいた
    • 点の変換が元の場所に戻る（全単射）だけで
    なく、その点同士の連続性も維持される（同
    相）の方が数学的に高度な概念
    14
    黒幕：鎌田参事官
    ©北海道地理空間フォーラム
    全単射じゃなく
    同相だお
    

    View Slide

15. 座標変換の手法 (1)
    対応点の三角網を作成する 15
    古地図と正確な地図の間に対
    応点（GCP）を整備すること
    で、三角網を生成
    

    View Slide

16. 座標変換の手法 (2)
    対応点の外包内での変換 16
    古地図 現代地図
    対応点の外包内では、座標は三
    角網を用いたベクタ計算で変換
    

    View Slide

17. 座標変換の手法 (3)
    対応点の外包外での変換 17
    古地図 現代地図
    古地図の図郭と対応する頂点を独
    自の計算法で現代地図側に定義す
    ることで、三角網の定義域を拡張
    

    View Slide

18. 18
    座標変換の手法 (4)
    古地図図郭外の変換
    古地図 現代地図
    古地図図郭の頂点と対応点の重
    心とで作られる三角を 4 つ定義
    し、図郭外の点はそれらの三角
    のベクタを延長して変換
    

    View Slide

19. 線から線への変換
    19
    New
    

    View Slide

20. 20
    従来のロジックの問題点
    古地図 現代地図
    道などの線要素が三角網の辺と交
    差していた場合、線上の点がもう
    一方の線上に変換されない問題
    

    View Slide

21. 21
    改善方法：
    対応線の導入 (1)
    古地図 現代地図
    対応線は常に三角網の辺として採
    用されるため、それに重なる線的
    要素は線に変換される
    対応線
    

    View Slide

22. 22
    改善方法：
    対応線の導入 (2)
    古地図 現代地図
    もし対応線が曲線の場合、補助対
    応点を自動的に挿入して三角網を
    拡張
    対応線
    

    View Slide

23. バス路線図などにも活用可能 23
    • 宇野バス様配信のGTFSデータ&同等のAPI経由で連携
    • 路線描画は路線図側もOSM側も同じ経緯度羅列で描画しています
    

    View Slide

24. バス路線図などにも活用可能 24
    • 宇野バス様配信のGTFSデータ&同等のAPI経由で連携
    • 路線描画は路線図側もOSM側も同じ経緯度羅列で描画しています
    

    View Slide

25. 地味にいろんな機能を使ってます 25
    

    View Slide

26. ECMASCRIPTモジュール化
    26
    New
    

    View Slide

27. 従来の構成
    • モジュール機構はrequire.jsを使用（AMDモジュール）
    • エディタ（MaplatEditor）を除く全ての実装（コアAPI、標準UI、Android
    ネイティブライブラリ、iOSネイティブライブラリ）を単独のレポジト
    リで管理（code4history/Maplat）
    27
    

    View Slide

28. 新しい構成
    • モジュール機構はEcmaScript2015のモジュール機構を使用し、Webpack/Babelで
    トランスパイル
    • 三角網生成・座標変換ライブラリ（MaplatTin）、
    コアAPI（MaplatCore）、
    モバイルネイティブとのGLUE（MaplatMobileGw）、
    Androidネイティブライブラリ（MaplatAndroid）、
    iOSネイティブライブラリ（MaplatiOS）、標準UI（Maplat）
    をそれぞれ独立リポジトリ化
    • リポジトリ間連携はnpm（node package manager）経由で
    28
    

    View Slide

29. 新しい構成
    • モジュール機構はEcmaScript2015のモジュール機構を使用し、Webpack/Babelで
    トランスパイル
    • 三角網生成・座標変換ライブラリ（MaplatTin）、
    コアAPI（MaplatCore）、
    モバイルネイティブとのGLUE（MaplatMobileGw）、
    Androidネイティブライブラリ（MaplatAndroid）、
    iOSネイティブライブラリ（MaplatiOS）、標準UI（Maplat）
    をそれぞれ独立リポジトリ化
    • リポジトリ間連携はnpm（node package manager）経由で
    29
    

    View Slide

30. 他技術との比較
    30
    

    View Slide

31. 他技術：Stroly は 2010 年に発表された同種
    の古地図処理技術 31
    

    View Slide

32. 他技術の用いている座標変換手法 32
    古地図 現代地図
    Stroly もベクタ計算を用いてい
    るが、三角網を形成するのでは
    なく、変換点近傍の3点を用い
    ており、トポロジが破壊される
    

    View Slide

33. 他技術との比較 (1)
    双方向変換後のエラー比較 33
    Maplat での変換
    Stroly での変換
    双方向変換後の平均変換誤差
    （ピクセル）
    Maplat: 0.00000000018
    Stroly: 11.09373539396
    

    View Slide

34. 他技術との比較 (2)
    対応機能比較マトリクス 34
    Items Stroly Maplat
    公開の容易さ ✔：編集後すぐ公開可能 ×：手作業デプロイ
    同相変換 × ✔：特許審査中
    方角縮尺変換 ×：縮尺変換にバグあり ✔：方角も縮尺もぴったり変換
    線から線への変換 × ✔
    地図重ね合わせ ×：切り替えのみ、もっさり ✔：常時重ね合わせ、きびきび
    オフライン対応 × ✔：PWA 対応
    ネットワーク環境 ×：インターネット環境のみ ✔：イントラ、ローカル動作可
    HTML 埋め込み対応 ×：IFRAME での埋め込みのみ ✔：DIV 埋め込み、API 制御可能
    シェア機能 ×：地図ページのシェアのみ ✔：地図ページと視点のシェア可能
    モバイル対応 ×：自社アプリ開発のみ ✔：iOS と Android のライブラリ提供
    POI 機能 ×：情報表示のみ ✔：リンクにより動作や遷移制御可
    オープンソース × ✔
    

    View Slide

35. Maplatの適用例
    35
    

    View Slide

36. 商用アプリの事例 36
    商用アプリの事例では、観光用
    途でのスマホネイティブアプリ
    採用が多い
    

    View Slide

37. 教育的適用事例 37
    既存GISよりも親しみやすい特徴を利用して、街の歴史を訪
    ねる街歩きフィールドワークなどに採用され、教育的効果
    を実証
    Geoアクティビティ
    コンテストで
    3冠受賞
    

    View Slide

38. 38
    デモサイト「ぷらっと〜」シリーズ
    展開中
    ぷらっと館林 https://s.maplat.jp/r/tatebayashimap/
    ぷらっといわき
    https://s.maplat.jp/r/iwakimap/
    ぷらっと奈良
    https://s.maplat.jp/r/naramap/
    ぷらっと会津若松
    https://s.maplat.jp/r/aizumap/
    

    View Slide

39. オリジナルアニメ巡礼地図
    も作成し提供 (ぷらっと館林) 39
    © 国土地理院
    地理院地図タイルを
    元に作成
    測量成果複製申請も取得済み
    おそらく測量申請までやって
    作成された初めての
    巡礼マップ
    

    View Slide

40. 今後の展開
    （2018年の進捗状況確認）
    40
    

    View Slide

41. 直近の展開（2018年）
    • 他ソースからのデータ変換機能
    • Stroly, David Ramsey Collection, MapWarperなどの他ソースからMaplat形式へ
    自動変換する機能をMaplatEditorに追加
    • MapWarperはオープンソースなので、それ自身を改造してMaplat表示する
    機能を準備
    • モバイルネイティブインタフェースの準備
    • 未ライブラリ化の動作サンプルは既に公開済み
    • ライブラリ化は2018年6月公開予定
    • API部品化をさらに徹底、表示機能とUI機能を分離
    • PWA化の徹底、SPA(Single Page Application)化などはAPIインタフェースを通
    じて実現
    41
    

    View Slide

42. 直近の展開（2019年チェック）
    • 他ソースからのデータ変換機能
    • Stroly, David Ramsey Collection, MapWarperなどの他ソースからMaplat形式へ
    自動変換する機能をMaplatEditorに追加
    • MapWarperはオープンソースなので、それ自身を改造してMaplat表示する
    機能を準備
    • モバイルネイティブインタフェースの準備
    • 未ライブラリ化の動作サンプルは既に公開済み
    • ライブラリ化は2018年6月公開予定
    • API部品化をさらに徹底、表示機能とUI機能を分離
    • PWA化の徹底、SPA(Single Page Application)化などはAPIインタフェースを通
    じて実現
    42
    

    View Slide

43. 独自ノウハウの拡充（2018年）
    • 点と点だけでなく、線を線に変換する技術検討中
    • 地図の定義と変換テーブル、タイル画像をセットとしてまとめて配信
    できるデータフォーマット検討中
    • WebからはHTTP Byte Rangeリクエストでランダムアクセス
    • サーバレスでの関連諸技術検討中
    • 古地図タイル化をサーバレスで実施
    • 分散型古地図共有リポジトリ
    • 古地図データの登録を受け付ける登録API
    • 古地図の存在はベクトルタイルで検知
    両者を点ではなく線として変換する
    43
    © OpenStreetMap
    

    View Slide

44. 独自ノウハウの拡充（2019年チェック）
    • 点と点だけでなく、線を線に変換する技術検討中
    • 地図の定義と変換テーブル、タイル画像をセットとしてまとめて配信
    できるデータフォーマット検討中
    • WebからはHTTP Byte Rangeリクエストでランダムアクセス
    • サーバレスでの関連諸技術検討中
    • 古地図タイル化をサーバレスで実施
    • 分散型古地図共有リポジトリ
    • 古地図データの登録を受け付ける登録API
    • 古地図の存在はベクトルタイルで検知
    両者を点ではなく線として変換する
    44
    © OpenStreetMap
    

    View Slide

45. 副産物の活用（2018年）
    • 生成した対応点を元にシンプレートスプライン変換画像のTMSタ
    イル等も提供
    • 時代を橋渡ししての位置特定用途等に寄与
    （明治期の地図の海岸線を使って、江戸期の海岸線の位置特定など）
    • 三角網での、実距離との比較を元に古地図/絵地図の歪み要
    素の比較指標を定義
    • 古地図内での注視点ごとの歪み度合いを時代比較して主題の変化を確認
    • 古地図ごとに最適な変換（Maplatを使うか、TMSタイルに変換するか）を評価す
    る指標にもなりうる
    45
    

    View Slide

46. 副産物の活用（2019年チェック）
    • 生成した対応点を元にシンプレートスプライン変換画像のTMSタ
    イル等も提供
    • 時代を橋渡ししての位置特定用途等に寄与
    （明治期の地図の海岸線を使って、江戸期の海岸線の位置特定など）
    • 三角網での、実距離との比較を元に古地図/絵地図の歪み要
    素の比較指標を定義
    • 古地図内での注視点ごとの歪み度合いを時代比較して主題の変化を確認
    • 古地図ごとに最適な変換（Maplatを使うか、TMSタイルに変換するか）を評価す
    る指標にもなりうる
    46
    

    View Slide

47. 将来の展開（2018年）
    • 3D Maplatの実現
    • 国土地理院の標高タイル形式でMaplat古地図タイル向けの標高タイルを定義す
    ることは可能（というか既にテスト作成済み）
    • Cesiumで読み込ませて古地図タイルと表示する事で、古地図の3D表示が実現可能
    • 高さの値の正規化要否は検討要
    • 鳥瞰図、写真Maplatの実現
    • 比較対象投影地図側に高さ情報を含んだ投影を想定
    • 鳥瞰図上で現在地表示、写真を3D地図に重ね合わせ
    • 古写真、浮世絵と現代写真、3D地図の重ね合わせ
    47
    

    View Slide

48. 将来の展開（2019年チェック）
    • 3D Maplatの実現
    • 国土地理院の標高タイル形式でMaplat古地図タイル向けの標高タイルを定義す
    ることは可能（というか既にテスト作成済み）
    • Cesiumで読み込ませて古地図タイルと表示する事で、古地図の3D表示が実現可能
    • 高さの値の正規化要否は検討要
    • 鳥瞰図、写真Maplatの実現
    • 比較対象投影地図側に高さ情報を含んだ投影を想定
    • 鳥瞰図上で現在地表示、写真を3D地図に重ね合わせ
    • 古写真、浮世絵と現代写真、3D地図の重ね合わせ
    48
    © 大阪市立大学
    

    View Slide

49. 2019年の新たな宿題（1）
    • POI内の検索、ウォークスルー
    • 大量のPOIがある場合、どのPOIが目
    的のPOIなのかをいちいち開かないと
    わからない
    • POI内の情報を検索したり、POIの内
    容を順番にウォークスルーする機能
    が必須
    49
    © Stroly, Rising Sun Rock Fes.
    

    View Slide

50. 2019年の新たな宿題（2）
    • 注記への注記機能
    • 変体かなその他で書かれた注記は現代人には読めない
    • また、海外の人にもわからない（日本人が海外の古地図を意外と楽しめるのは、
    漢字やローマ字が読めるからではないか、という仮説）
    • 古地図注記に現代語や多言語化したデジタル注記を加え、オーバーレイや検索で
    きるように
    50
    きかいが嶋
    © Klokan Technologies
    

    View Slide

51. 2019年の新たな宿題（3）
    • 様々な用途に使えるGCPの流通仕様として、Maplatデータ
    フォーマットを整備
    • 既存のGISによる歪ませるアプローチも、街歩きなどには向かないだけで無意味な
    わけでは全くない <= 同じGCPの情報が使える
    • 2018年の今後の展開でも書いた、古地図の注視度インデックスなどにも使えるかも
    • GCP（および対応線）を古地図のメタデータとして普及させたい
    • 課題
    • トポロジーエラー解消のために便宜的に加えたGCPをちゃんと見分けられるように
    • GCPの種類（施設の位置の対応、交差点の対応、地物の角の対応、etc）を見分けられるよ
    うに
    51
    

    View Slide

52. スポンサー様がつきました
    • 金銭的寄付からツールライセンス無
    償提供まで、助けていただけるよう
    になりました
    • いただいた補助をうまく活かして、
    ドキュメンテーションやデザインな
    ど弱い部分の強化を進めていきます
    52
    

    View Slide

53. 猛者募集（Code for History）
    • さみしいですっ！
    • 特にデザインできる人募集
    （機能実装したいのに、技術的実装
    方法は目星ついていてもUIを思いつ
    かないために実装に移れていない機
    能が多い）
    • ドキュメント手伝ってくださる方
    53
    モサドくん（妻命名）© HERE Mobility
    

    View Slide

54. 54
    End
    User: kochizufan
    Repository: code4history/Maplat
    E-mail: kochizufan@gmail.com
    資料: http://bit.ly/maplat_f4g_kbe
    

    View Slide