Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
マピオン、ベクタータイルはじめました〜京都編〜
Search
One compath
October 15, 2017
Technology
9
2k
マピオン、ベクタータイルはじめました〜京都編〜
FOSS4G 2017 KYOTO.KANSAI の発表資料です。
One compath
October 15, 2017
Tweet
Share
More Decks by One compath
See All by One compath
社内の制度を使って新規事業を⽴ち上げてみた話 OCEM#3
mapion
0
94
新規事業のアプリ、Flutterで作ってます〜U-ROUTEのポイ活対応編〜 OCEM#3
mapion
0
94
ウォーキングアプリ「aruku&」ってどうやって作ってるの? OCEM#3
mapion
0
110
ONE COMPATH/ワンコンパス Company Deck For Engineer(会社紹介資料)
mapion
0
4.3k
ONE COMPATHの地図の開発技術~入門編~ OCEM #2
mapion
0
170
脱レガシー! Aurora PostgreSQLに移行してみた OCEM #2
mapion
1
610
エンジニアなので「技術」で仕事を効率化してみた ~Slack連携でチームの生産性が向上~ OCEM#2
mapion
0
150
20221112_FOSS4G2022Online.pdf
mapion
0
1.3k
ONE COMPATH/ワンコンパス Company Deck(会社資料)
mapion
0
280
Other Decks in Technology
See All in Technology
適材適所の技術選定 〜GraphQL・REST API・tRPC〜 / Optimal Technology Selection
kakehashi
1
700
Incident Response Practices: Waroom's Features and Future Challenges
rrreeeyyy
0
160
OCI Security サービス 概要
oracle4engineer
PRO
0
6.5k
インフラとバックエンドとフロントエンドをくまなく調べて遅いアプリを早くした件
tubone24
1
430
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
IBC 2024 動画技術関連レポート / IBC 2024 Report
cyberagentdevelopers
PRO
1
120
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
29
13k
Adopting Jetpack Compose in Your Existing Project - GDG DevFest Bangkok 2024
akexorcist
0
110
RubyのWebアプリケーションを50倍速くする方法 / How to Make a Ruby Web Application 50 Times Faster
hogelog
3
950
rootlessコンテナのすゝめ - 研究室サーバーでもできる安全なコンテナ管理
kitsuya0828
3
390
10XにおけるData Contractの導入について: Data Contract事例共有会
10xinc
6
670
あなたの知らない Function.prototype.toString() の世界
mizdra
PRO
1
200
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1030
460k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
GraphQLとの向き合い方2022年版
quramy
43
13k
Music & Morning Musume
bryan
46
6.2k
Building Adaptive Systems
keathley
38
2.3k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Into the Great Unknown - MozCon
thekraken
32
1.5k
Raft: Consensus for Rubyists
vanstee
136
6.6k
Git: the NoSQL Database
bkeepers
PRO
427
64k
A designer walks into a library…
pauljervisheath
204
24k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
6.8k
Transcript
マピオン ベクタータイル はじめました 株式会社マピオン 清水珠里 FOSS4G 2017 KYOTO.KANSAI
ਗ਼ਫचཬʢ͠Έͣ͡ΎΓʣ ৽ଔͰෆಈ࢈ձࣾʹೖࣾ ɹ→͍Ζ͍Ζ͋ͬͯ̍Ͱୀ৬ SIerʹస৬ ɹ→͍Ζ͍Ζ͋ͬͯ̔Ͱୀ৬ גࣜձࣾϚϐΦϯೖࣾ̐ ओʹਤλΠϧͷੜͱ৴Λ୲ ࣗݾհ
マピオンとは
1996ʹຊॳͷਤΠϯλʔωοταʔϏεΛ։࢝
໊শɹɹɹ ɿ גࣜձࣾϚϐΦϯ ઃཱɹɹɹ ɿ 1997 1݄ 20 ࢿຊۚɹɹ ɿ
6ԯԁ ैۀһ ɿ 97໊ʢ20176݄ݱࡏʣ גओɹɹɹ ɿ ತ൛ҹ ʢ100%ʣ εϩʔΨϯ ɿʮίίϩɺΧϥμɺಈ͔͢ϚϐΦϯʯ ࢀՃஂମ ɿOSGeoࡒஂຊࢧ෦ ๏ਓձһ Ԋֵ 20पΛܴ͑·ͨ͠ʂ
ࣄۀ༰
マピオン ベクタータイル はじめてました
2016/10 ϥϘαΠτʹͯ ϚϐΦϯϕΫλʔެ։
า͚ͩ͘ͰϓϨθϯτ͕ Β͑ΔɺҰาઌߦ͘Υʔ ΩϯάΞϓϦ 2016/11 aruku&ʢ͋Δ͘ͱʣϦϦʔε
ܙํרΛ৯Δํ͕͔֯ ΔɺʹҰ͞ΕΔΞ ϓϦ 2017/1 ܙํϚϐΦϯ(iOS൛)ͷਤΛ ϥελʔ͔ΒϕΫλʔʹมߋ
2017/9 ϥϘαΠτʹOSMՃ
ベクタータイルを 描画するしくみ
ϕΫλʔλΠϧ εϓϥΠτ ϑΝΠϧ ϑΥϯτ ϑΝΠϧ ελΠϧ ϑΝΠϧ ϕΫλʔλΠϧʹɾઢɾ໘ͷͷσʔλͱ ଐੑใ͕ೖ͍ͬͯΔ͚ͩͳͷͰɺ͝ͱͷද ࣔͷ༗ແɺσβΠϯɺϑΥϯτɺΞΠίϯͳͲ
ελΠϧϑΝΠϧͰઃఆ͢Δ ϨϯμϦϯά
ݱࡏͷϚϐΦϯͷߏ ϕΫλʔλΠϧ Mapbox Vector Tile ϨϯμϦϯά Mapbox GL Native ελΠϧϑΝΠϧ
Mapbox Style
ɾϕΫλʔਤΛෳͷϓϥοτϑΥʔϜ্ ͷωΠςΟϒΞϓϦέʔγϣϯʹຒΊࠐΉͨ ΊͷϥΠϒϥϦ ɹJS൛ɺUnity൛ผ్༻ҙ͞Ε͍ͯΔ ɾΦʔϓϯιʔεɺBSDϥΠηϯε ɾ։ൃ͕͔͞ΜͰɺͲΜͲΜόʔδϣϯΞο ϓ͞Ε͍ͯΔʢલόʔδϣϯͱޓੑ͕ͳ͍ ͜ͱଟ͍ͨΊɺҙ͕ඞཁʣ .BQCPY(-/BUJWFͱ
ɾMapboxͷਤΛදࣔͤ͞ΔʹΞΫηε τʔΫϯͷൃߦ͕ඞཁ ɹαʔυύʔςΟͷਤΛදࣔ͢Δ߹ ΞΫηετʔΫϯෆཁ ϚϐΦϯͰΧελϚΠζΛߦ͍ɺ ΞΫηετʔΫϯʹରԠ͍ͯ͠Δ .BQCPY(-/BUJWFͱ
Mapbox GL で 地図を描画するために 必要なもの
ɾϕΫλʔλΠϧ ɹʢMapbox Vector Tileʣ ɾελΠϧϑΝΠϧ ɹʢMapbox Styleʣ ɾεϓϥΠτϑΝΠϧ ɾϑΥϯτϑΝΠϧ
ɾϕΫλʔλΠϧ ɹʢMapbox Vector Tileʣ ɾελΠϧϑΝΠϧ ɹʢMapbox Styleʣ ɾεϓϥΠτϑΝΠϧ ɾϑΥϯτϑΝΠϧ
ϕΫλʔλΠϧ ʢMapbox Vector Tileʣ ɾMapbox͕ఆΊͨϕΫλʔλΠϧͷΦʔϓ ϯͳ༷ ɾProtocol Buffers ܗࣜ ɾGeometryͷ૬ର࠲ඪΛΤϯίʔυͨ͠
ͷͱଐੑใͷू·Γ
sample MBZFST\ OBNFYYYY GFBUVSFT\ UBHT UBHT UZQF10-:(0/ HFPNFUSZ HFPNFUSZ ʜ
^ LFZTDPEF WBMVFT\ JOU@WBMVF ^ WFSTJPO ^ ʜ Geometryͷ ૬ର࠲ඪ ଐੑใ
ɾϕΫλʔλΠϧ ɹʢMapbox Vector Tileʣ ɾελΠϧϑΝΠϧ ɹʢMapbox Styleʣ ɾεϓϥΠτϑΝΠϧ ɾϑΥϯτϑΝΠϧ
ελΠϧϑΝΠϧ ʢMapbox Styleʣ ɾਤͷσβΠϯΛܾΊΔϑΝΠϧ ɾjsonܗࣜ ɾϚϐΦϯͰ MVT Styler Λͬͯɺ࡞/ ฤूΛߦ͍ͬͯΔ
ʜ MBZFST< \ JETBNQMF
UZQFpMM TPVSDFTBNQMF TPVSDFMBZFSTBNQMF pMUFS< DPEF > QBJOU\ pMMDPMPSCF ^ ^ > ʜ sample
શGUIͷϕΫλʔλΠϧελΠϧΤσΟλ MVT Styler
MVT Styler ɾϦΞϧλΠϜͰσβΠϯͷมߋ ͕֬ೝͰ͖Δ ɾγϯϓϧͳػೳͰɺײతʹૢ ࡞Ͱ͖Δ ɾਤ্ͰϨΠϠʔΛ֬ೝͰ͖Δ ͷͰศར ɾϚϐΦϯͰΧελϚΠζͯ͠ɺ ϑΝΠϧग़ྗ
/ ը૾ग़ྗͳͲͷػ ೳΛՃ͍ͯ͠Δ
MVT Styler Maputnik
ɾϕΫλʔλΠϧ ɹʢMapbox Vector Tileʣ ɾελΠϧϑΝΠϧ ɹʢMapbox Styleʣ ɾεϓϥΠτϑΝΠϧ ɾϑΥϯτϑΝΠϧ
εϓϥΠτϑΝΠϧ ɾਤ্ͷΞΠίϯΛ·ͱΊͨεϓϥΠτϑΝΠϧ ɾpngϑΝΠϧͱjsonϑΝΠϧͰߏ͞ΕΔ ɾMVT Styler Ͱ࡞Ͱ͖Δ
\lTBNQMFTWH\XJEUI IFJHIU Y Z QJYFM3BUJP^ lTBNQMFTWH\XJEUI IFJHIU
Y Z QJYFM3BUJP^ ʜ KTPO QOH sample
ɾϕΫλʔλΠϧ ɹʢMapbox Vector Tileʣ ɾελΠϧϑΝΠϧ ɹʢMapbox Styleʣ ɾεϓϥΠτϑΝΠϧ ɾϑΥϯτϑΝΠϧ
ϑΥϯτϑΝΠϧ ɾϑΥϯτϑΝΠϧʢttfͳͲʣ͔ΒglyphΛ 256୯ҐͰׂͯͦ͠ΕΛpbfԽͨ͠ͷ ɹttfϑΝΠϧ ɹ→ 0-255.pbf, 256-511.pbf ... 256ݸ ɾMVT
Styler Ͱ࡞Ͱ͖Δ
マピオンの ベクタータイルの 生成/配信のしくみ
ϨϯμϦϯά ɹਤσβΠϯ λΠϧੜ σʔλ ४උ ϑΝΠϧ ετϨʔδ 4IBQF pMF %#
1PTUHSFT 1PTU(*4 ετϨʔδ ΫϥΠΞϯτ ੜ༻ αʔό ϕΫλʔλΠϧ ʢQCG .75 4UZMFS εϓϥΠτ ϑΝΠϧ ʢQOH KTPO ϑΥϯτ ϑΝΠϧ ʢQCG ελΠϧ ϑΝΠϧ ʢKTPO ४උɾੜ 24࣌ؒ
σʔλ ४උ ϑΝΠϧ ετϨʔδ ݱࡏɺϚϐΦϯͰରԠ͍ͯ͠Δ ਤσʔλ ɹɾθϯϦϯ ɹɾOSM ɹɾNatural Earth
ɹɾࠃใͷ ɹɹਁਫఆσʔλ ɹɹਓޱूத۠σʔλ 4IBQF pMF %# 1PTUHSFT 1PTU(*4
ϨϯμϦϯά ɹਤσβΠϯ λΠϧੜ σʔλ ४උ ϑΝΠϧ ετϨʔδ 4IBQF pMF %#
1PTUHSFT 1PTU(*4 ετϨʔδ ΫϥΠΞϯτ ੜ༻ αʔό ϕΫλʔλΠϧ ʢQCG .75 4UZMFS εϓϥΠτ ϑΝΠϧ ʢQOH KTPO ϑΥϯτ ϑΝΠϧ ʢQCG ελΠϧ ϑΝΠϧ ʢKTPO
ετϨʔδ ɾPostGIS 2.4.0͔ΒՃ͞ΕͨST_ASMVTͱ ͍͏ؔͰλΠϧใ͕औಘͰ͖Δ ɹRDS͕PostGIS 2.4.0ʹରԠ͍ͯ͠ͳ͍ͨΊɺ ϚϐΦϯͰSQLΛΨϦΨϦॻ͍͍ͯ·͢… λΠϧੜ %# 1PTUHSFT
1PTU(*4 ੜ༻ αʔό ϕΫλʔλΠϧ ʢQCG
ετϨʔδ ɾϑΝΠϧʹग़ྗͤͣɺDB͔ΒϦΞϧλ ΠϜͰλΠϧΛ৴͢Δ͜ͱͰ͖Δ ύϑΥʔϚϯε͕ѱ͘ͳͬͯ͠·͏ՄೳੑΞϦ λΠϧੜ %# 1PTUHSFT 1PTU(*4 ੜ༻
αʔό ϕΫλʔλΠϧ ʢQCG
ϥϘαΠτ BSVLV ಉ͡ϕΫλʔλΠϧΛ ͍ͬͯΔ
ϚϐΦϯͷʮඒ͍͠ʯʮ໎Θͳ͍ʯਤ ελΠϧϑΝΠϧɿ25000ߦҎ্ ϨΠϠʔɿ691
MapboxGLの弱点 現時点の
λΠϧͷςΩετ͕ॏͳͬͨ߹ͲͪΒ ͔ҰํͷΈදࣔ͞ΕΔ͕ɺ λΠϧͷڥքͩͱͦͷผ͕Ͱ͖ͣɺςΩε τ͕ॏͳͬͯ͠·͏ λΠϧڥքͷه͕ॏͳͬͯ͠·͏ ه͕ॏͳ͍ͬͯΔ
TZNCPMBWPJEFEHFTUSVF λΠϧڥͷςΩετΛඇදࣔʹ͢ΔΦϓγϣ ϯ͋Δ͕ɺͲͪΒͷهফ͑ͯ͠·͏ Issueొࡁ λΠϧڥքͷه͕ॏͳͬͯ͠·͏ ফ͑ͨ…
ϚϧνόΠτͷॎॻ͖ه͕ෆ҆ఆ
ϚϧνόΠτͷॎॻ͖ه͕ෆ҆ఆ ࢼ͠ʹ௨Γͷ໊લΛ ʮژͰFOSS4GͩΑʯʹมߋ͢Δͱɺ จࣈ͕͔Ϳͬͯ͠·͏ γϯάϧόΠτจࣈͱϚϧνόΠτจࣈ͕ ࠞࡏ͢ΔهΛॎॻ͖ʹ͢Δͱɺจࣈ͕͔Ϳͬ ͯ͠·͏
ϚϧνόΠτͷॎॻ͖ه͕ෆ҆ఆ ೋॏʹͳ͍ͬͯͯɺ ಡΊͳ͍… هͷॎॻ͖Λແޮʹ͢ΔΦϓγϣϯΛ͚ͭ Δͱจࣈ͕ೋॏʹͳͬͯ͠·͏ UFYULFFQVQSJHIUGBMTF
ϚϧνόΠτͷॎॻ͖ه͕ෆ҆ఆ ϚϐΦϯͰɺ֯จࣈΛશ֯ʹมͯ͠ର Ԡ͍ͯ͠Δ FOSS4GΛશ֯ʹ͢Εɺ ͳ͘දࣔ͞ΕΔ
今後の展望
ɾMapbox Vector Tile σϑΝΫτελϯ μʔυʹͳΓͭͭ͋ΔΦʔϓϯͳ༷ ɾMapbox Vector TileʹରԠͨ͠πʔϧ ଟ͋͘Γɺ͜Ε͔Β૿͍͑ͯ͘ͱࢥΘΕΔ ex)
Mapzen, Klokan Technologies, MVT Styler, Maputnik etc… ͍ΖΜͳՄೳੑ͕͕ͬͨʂ
ϚϐΦϯͰ ɾਤͷ৴ ɾਤAPIͷఏڙ ɾਤSDKͷఏڙ ɾਤσβΠϯπʔϧͷఏڙ ɾਤ৴γεςϜͷఏڙ ͳͲͷGIS։ൃࢧԉαʔϏεΛߏதʂ λʔήοτ ɹҐஔใΛ׆༻͍ͨ͠શͯͷਓ ɹҐஔใΛఏڙ͍ͨ͠શͯͷਓ
乞うご期待!
ࢀߟURL ɹ˙ϚϐΦϯϕΫλʔ IUUQTNBQJPOHJUIVCJPNBQJPOWFDUPS ˙BSVLV IUUQTXXXBSVLVUPKQ ˙ܙํϚϐΦϯ J04൛ IUUQTJUVOFTBQQMFDPNKQBQQܙํϚϐΦϯJE NU
˙.BQCPY(-/BUJWF IUUQTHJUIVCDPNNBQCPYNBQCPYHMOBUJWF ˙.BQCPY(-+4 IUUQTHJUIVCDPNNBQCPYNBQCPYHMKT ˙.BQCPYVOJUZTEL IUUQTHJUIVCDPNNBQCPYNBQCPYVOJUZTEL ˙.BQCPY7FDUPS5JMF4QFDJpDBUJPO IUUQTXXXNBQCPYDPNWFDUPSUJMFTTQFDJpDBUJPO ˙.BQCPY4UZMF4QFDJpDBUJPO IUUQTXXXNBQCPYDPNNBQCPYHMKTTUZMFTQFD ˙.754UZMFS IUUQTTQVUOJLNBQTHJUIVCJPNWUTUZMFS ˙εϓϥΠτϑΝΠϧΛ࡞Δπʔϧ IUUQTHJUIVCDPNNBQCPYTQSJUF[FSP IUUQTHJUIVCDPNNBQCPYTQSJUF[FSPDMJ ˙ϑΥϯτϑΝΠϧΛ࡞Δπʔϧ IUUQTHJUIVCDPNNBQCPYOPEFGPOUOJLɹ
おわり