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
2.3k
9
Share
マピオン、ベクタータイルはじめました〜京都編〜
FOSS4G 2017 KYOTO.KANSAI の発表資料です。
One compath
October 15, 2017
More Decks by One compath
See All by One compath
社内の制度を使って新規事業を⽴ち上げてみた話 OCEM#3
mapion
0
210
新規事業のアプリ、Flutterで作ってます〜U-ROUTEのポイ活対応編〜 OCEM#3
mapion
0
240
ウォーキングアプリ「aruku&」ってどうやって作ってるの? OCEM#3
mapion
0
220
ONE COMPATH/ワンコンパス Company Deck For Engineer(会社紹介資料)
mapion
0
8.3k
ONE COMPATHの地図の開発技術~入門編~ OCEM #2
mapion
0
230
脱レガシー! Aurora PostgreSQLに移行してみた OCEM #2
mapion
1
990
エンジニアなので「技術」で仕事を効率化してみた ~Slack連携でチームの生産性が向上~ OCEM#2
mapion
0
230
20221112_FOSS4G2022Online.pdf
mapion
0
1.8k
ONE COMPATH/ワンコンパス Company Deck(会社資料)
mapion
0
390
Other Decks in Technology
See All in Technology
最初の一歩を踏み出せなかった私が、誰かの背中を押したいと思うようになるまで / give someone a push
mii3king
0
160
みんなで作るAWS Tips 100連発 (FinOps編)
schwrzktz
1
300
こんなアーキテクチャ図はいやだ / Anti-pattern in AWS Architecture Diagrams
naospon
1
450
Standards et agents IA : un tour d’horizon de MCP, A2A, ADK et plus encore
glaforge
0
160
Choose your own adventure in agentic design patterns
glaforge
0
140
生成AIが変える SaaS の競争原理と弁護士ドットコムのプロダクト戦略
bengo4com
0
250
Amazon S3 Filesについて
yama3133
2
210
Oracle AI Database@AWS:サービス概要のご紹介
oracle4engineer
PRO
4
2.3k
Bill One 開発エンジニア 紹介資料
sansan33
PRO
6
18k
Rebirth of Software Craftsmanship in the AI Era
lemiorhan
PRO
4
2k
AI時代における技術的負債への取り組み
codenote
1
1.5k
Practical TypeProf: Lessons from Analyzing Optcarrot
mame
0
320
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.7k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
180
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
370
Statistics for Hackers
jakevdp
799
230k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
27
3.4k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
270
Mind Mapping
helmedeiros
PRO
1
150
SEO for Brand Visibility & Recognition
aleyda
0
4.5k
Making the Leap to Tech Lead
cromwellryan
135
9.8k
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
730
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ɹ
おわり