目前Mapbox在自動(dòng)駕駛領(lǐng)域布局很深,幾個(gè)Uber高管入職Mapbox,Vision SDK也開始公測(cè),初入自動(dòng)駕駛領(lǐng)域的我必須緊跟步伐。
再看看國(guó)內(nèi)各大廠,早以換成前端渲染引擎,而朋友圈內(nèi)大佬,
淡叔 Mapbox GL JS本地化實(shí)踐
一休哥 《權(quán)力的游戲》3d地圖-基于Mapbox customlayer
公瑾 Mapbox本地離線部署
也都在追Mapbox,前端渲染必成大勢(shì)所趨。
我理解的前端渲染
前端渲染即借助前端js引擎對(duì)地圖矢量瓦片進(jìn)行渲染。例如:Mapbox gl js就是一個(gè)瀏覽器端的渲染引擎,矢量瓦片就是Mapbox Vector Tiles。其優(yōu)勢(shì)是什么,看看Mapbox官網(wǎng):
Benefits of vector tiles
Vector tiles have two important advantages over fully rendered image tiles:
- Styling: as vectors, tiles can be styled when requested, allowing for many map styles on global data
- Size: vector tiles are really small, enabling global high resolution maps, fast map loads, and efficient caching
Mapbox Streets, our global basemap, is entirely made of vector tiles. Any map data you upload with Mapbox Studio is converted into vector tiles before styling.
總體思路
假如你現(xiàn)在需要對(duì)一個(gè)園區(qū)進(jìn)行地圖制作,想做成矢量瓦片并在前端進(jìn)行渲染,這篇文章適合你。
首先我們要把現(xiàn)有的矢量文件制作成mvt格式的矢量瓦片,接著針對(duì)要渲染的各個(gè)圖層及背景圖層定義Style(不借助Mapbox Studio情況下),大體就這樣。作者今天就來操作,敬請(qǐng)期待。
接著說,在作者這兩天摸索的同時(shí),非常有幸看到這位大神的著作,拜讀一下收獲頗豐——《開源方案搭建可離線的精美矢量切片地圖服務(wù)-1.開篇(附成果演示地址)》,該大神分好幾篇循序漸進(jìn)講解如何制作一個(gè)矢量瓦片圖,并通過Mapbox gl js前端渲染。在這就不班門弄斧了,在大神文章指引下,一步步制作出一張粗略的地圖。
