注：本文中所述內(nèi)容僅作為研究用途，不包括任何技術(shù)細節(jié)，不提供數(shù)據(jù)爬取、非法攻擊的咨詢和支持。另：百度建筑輪廓數(shù)據(jù)中存在明顯簽名式錯誤，下載使用容易被追求侵權(quán)。

矢量瓦片：爬取百度地圖必須要了解矢量瓦片。矢量瓦片是二進制數(shù)據(jù)。技術(shù)以maxbox為標準。詳情可以參考矢量地理數(shù)據(jù)如何切片？

WebGL:OpenGL的一個javascript綁定。WebGL可以為HTML5 Canvas提供硬件3D加速渲染，Web開發(fā)人員可以借助系統(tǒng)顯卡來在瀏覽器里更流暢地展示3D場景和模型wonder-yyc：分享收集的Web 3D學(xué)習(xí)資源

矢量瓦片技術(shù)需要 部署java web。也可以通過本地部署 java web服務(wù)器（tomcat）調(diào)試js。

百度地圖更新后三維模型更加精細了。因為模型是提前建好的，然后將三維模型保存為頂點緩沖和索引，最后直接通過WebGL的方式顯示到畫布上。（高德還是采用建筑輪廓，并通過高度進行拉伸得到的三維模型）

說白了，百度地圖的模型就像是（我們在建模軟件里面建完的模型一樣）。模型通過計算機圖形學(xué)（webgl）渲染到屏幕上。

所以建筑高度沒有了。

取而代之的是模型渲染信息（頂點緩沖和索引）

投機取巧的童鞋可以洗洗睡了。但是在gis工作者眼中還是小兒科。

技術(shù)前提：了解javascript,了解webgl（three.js,重點！！）或者opengl。了解瀏覽器調(diào)試技巧，斷點調(diào)試。了解地圖架構(gòu)與java web服務(wù)器交互（此片文章不牽扯太深刻，不懂的同學(xué)也可以通過這篇文章改變你對百度地圖的看法)

之前一直有人說百度地圖更新后數(shù)據(jù)加密了，其實這是不完全正確的。百度地圖之前采用的是柵格瓦片，不支持三維建筑高度。升級后采用的是webgl與矢量瓦片。矢量瓦片返回的就是二進制數(shù)據(jù)，所以返回數(shù)據(jù)沒有加密，僅僅是在對其矢量瓦片的請求url進行了封裝,，請求的url同樣可以通過js跟蹤調(diào)試解密。然后把二進制數(shù)據(jù)經(jīng)過解析(可以調(diào)試出json數(shù)據(jù))后交給瀏覽器webgl渲染。

原來的柵格瓦片雖然比較好爬取，直接加載圖片在體驗上效果非常差，地圖縮放會有明顯的層級感，不支持3D模型等問題，隨著webgl技術(shù)越來越成熟，電腦性能強大，大部分地圖都支持了webGL渲染，所以傳輸?shù)膱D形就是加密過的矢量數(shù)據(jù)了

所以現(xiàn)在有兩個版本的百度地圖。一個是以前的，不含高度。另一個是現(xiàn)在通過webgl渲染得到的三維百度地圖

如果你把瀏覽器的webgl禁用，例如：在谷歌瀏覽器的快捷方式目標中加上 --disable-webgl

這時，打開百度地圖,F12

可以看到請求url是https://maponline2.bdimg.com/tile/?qt=vtile&x=3158&y=1180&z=14&styles=pl&udt=20200928&scaler=1&showtext=1，未加密。返回的是柵格圖片

如果把瀏覽器的webgl啟用

如上圖1處是加密的url,二處是二進制矢量數(shù)據(jù)

下面開始跟蹤解密。

找到lnitiator，查看這個url的調(diào)用堆棧（是由哪個js發(fā)起的）

跟進，找到關(guān)鍵js文件，格式化（這里說一句，這個webworker js）

在WebGL中，我們就知道無論什么樣的3D模型或者2D的形狀，繪制的時候需要拆分成三角形頂點。有些模型可以提前準備好，使用時直接從服務(wù)端加載，但是另外一些情況數(shù)據(jù)可能沒有分解為三角形或者需要進行額外的處理才能使用，這就需要在瀏覽器中進行加工處理。

比如用WebGL實現(xiàn)一些基礎(chǔ)圖形的繪制，就需要把圖形分解為三角形，這個過程稱為Triangulation，即三角形化。在圖形元素過多、數(shù)據(jù)量較大的情況下，分解過程可能會比較耗時。在JavaScript同步處理可能會影響頁面性能。因此可以考慮使用WebWorker做異步處理。對于數(shù)據(jù)可從服務(wù)端獲取的，獲取數(shù)據(jù)的邏輯也可以寫在WebWorker中。

所以頂點緩沖和索引以及加解密函數(shù)都在這個js文件中。

可以看到這個js文件是混淆的，就慢慢一點點分析吧

下斷點，運行，F10單步走

在堆棧中看到調(diào)用了那些變量函數(shù)

經(jīng)過耐心的分析，最終可以找到加密url的函數(shù)，寫一個c#解密函數(shù)：

同理可以解析出二進制數(shù)據(jù)

我們再看看這個js:

function ra(b, a) {var c = qa;return parseFloat((c.i[a] - c.i[b]).toFixed(2)) } ba.prototype.w = ea.performance && ea.performance.now ? function() {return performance.now() } : function() {return Date.now() } ; var ya, za, Da, Ea, Fa, Ga, A, Ha, Ia, Ra, Sa, Ta, Ua, Va, Wa, Xa, Ya, hb; ArrayBuffer.prototype.slice || (ArrayBuffer.prototype.slice = function(b, a) {void 0 === b && (b = 0);void 0 === a && (a = this.byteLength);b = Math.floor(b);a = Math.floor(a);0 > b && (b += this.byteLength);0 > a && (a += this.byteLength);b = Math.min(Math.max(0, b), this.byteLength);a = Math.min(Math.max(0, a), this.byteLength);if (0 >= a - b)return new ArrayBuffer(0);var c = new ArrayBuffer(a - b), q = new Uint8Array(c);b = new Uint8Array(this,b,a - b);q.set(b);return c } );function jb() {Ua || (Ua = A._get_line_vertex_start());return new Float32Array(ya.slice(Ua, A._get_line_vertex_end())) } function kb() {Ta || (Ta = A._get_line_index_start());return new Uint16Array(ya.slice(Ta, A._get_line_index_end())) } function lb() {return A._get_line_vertex_count() } function mb(b, a, c, q, h, f, g, u, w, p, m) {var k = 0;q && (k = q.length,Ia || (Ia = A._get_line_altitudes_address() >> 1),Fa.set(q, Ia));u && u.length && (Sa || (Sa = A._get_line_turnings_address()),za.set(u, Sa));h = h || 0;p = p || 0;m = m || g.length / 2;Ha || (Ha = A._get_line_data_address() >> 1);Fa.set(b, Ha);Ra || (Ra = A._get_line_points_address() >> 2);Ea.set(g, Ra);A._append_line_data(b.length, a[0], a[1], a[2], a[3], c, k, h, f ? 1 : 0, g.length, w, p, m) }

這些都是與webgl繪制有關(guān)的函數(shù)，而且在webgl中使用了頂點數(shù)組對象（Vertex Array Object），通過它可以簡化緩沖區(qū)的綁定過程，即可以減少代碼的調(diào)用次數(shù)，也提升了 WebGL 狀態(tài)切換的效率。

我們還可以直接從worker返回消息處入手（攔截，偽造https證書替換js），將解析后的頂點緩沖和索引進行解析，直接獲得建筑的平面數(shù)據(jù)和高度。把這些數(shù)據(jù)保存下來，并通過后期的處理，即可以獲得比較完整的百度地圖建筑輪廓數(shù)據(jù)。

總結(jié)

以上是生活随笔為你收集整理的retrofit 解析百度地图api 返回数据_新版百度地图建筑数据含高度解析的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。