3D渲染中，我們稱傳入材質(zhì)的紋理為貼圖。貼圖一詞強(qiáng)調(diào)其用途，當(dāng)某個(gè)紋理用于在材質(zhì)中實(shí)現(xiàn)法線效果時(shí)，我們稱之為法線貼圖。而在EasyV中，我們地圖組件填充樣式中的自定義上傳的圖片稱之為「地圖貼圖」，主要用于地圖表面/頂面的樣式設(shè)置，因此也稱之為「頂面貼圖」。

在使用EasyV地圖組件時(shí)，我們常常通過配置頂面貼圖，加深地圖的真實(shí)感和美觀度，讓大屏效果更精美。但在實(shí)際配置中，我們經(jīng)常遇到制作好的貼圖上傳后無法和地圖組件輪廓融合，出現(xiàn)我們所說的“對(duì)不齊”的問題。

接下來我們將具體從問題原因分析入手，再到具體頂面貼圖制作實(shí)操，帶大家詳細(xì)了解頂面貼圖的配置技巧及注意事項(xiàng)。

一、原因分析

出現(xiàn)頂面貼圖誤差的原因通常主要存在三類原因：貼圖和地圖的坐標(biāo)系不一致、貼圖存在旋轉(zhuǎn)、邊距參數(shù)設(shè)置不合適。

（一）貼圖和地圖的坐標(biāo)系不一致

EasyV的地圖組件通常包含墨卡托和WGS 84這兩種坐標(biāo)系投影方式。墨卡托坐標(biāo)系是在墨卡托投影（是一種圓柱投影）的基礎(chǔ)上的一種平面直角坐標(biāo)系，適用于大部分區(qū)域，整體接近正方形，尤其在赤道附近的區(qū)域具有較好的保真性（形狀保持），但在高緯度地區(qū)會(huì)出現(xiàn)面積變形，在QGIS中的代號(hào)為EPSG: 3857。而WGS84是全球衛(wèi)星定位系統(tǒng)（如GPS）所采用的標(biāo)準(zhǔn)坐標(biāo)系統(tǒng)，接近于長(zhǎng)方形布局，也被廣泛用于地圖、測(cè)量和地理信息系統(tǒng)（GIS）中，適用于各種地理信息應(yīng)用，在QGIS中的代號(hào)為EPSG: 4326。因此我們?cè)谶M(jìn)行貼圖制作前，需要確認(rèn)好最終組件選擇投影方式，以便于最后貼圖的對(duì)齊。

同時(shí)，在我們?cè)嫉貓D數(shù)據(jù)獲取時(shí)，不同的地圖信息平臺(tái)提供數(shù)據(jù)的坐標(biāo)系也會(huì)不同，獲取到的數(shù)據(jù)也會(huì)與平臺(tái)本身的坐標(biāo)系不匹配，導(dǎo)致最終貼圖上傳后出現(xiàn)誤差。因此我們?cè)谶M(jìn)行貼圖制作前，需要確認(rèn)好最終組件選擇投影方式與原始數(shù)據(jù)的坐標(biāo)系的匹配，以便于最后貼圖的對(duì)齊。

（二）貼圖存在旋轉(zhuǎn)

這里我們所說的旋轉(zhuǎn)主要是指貼圖中內(nèi)容的展示角度與原有組件數(shù)據(jù)或者自定義上傳的goejson數(shù)據(jù)效果不一致，也會(huì)出現(xiàn)很明顯的偏差，導(dǎo)致無法與地圖邊界對(duì)齊。在制作貼圖時(shí)，我們也需要提前確定好最后地圖的展示角度，做好數(shù)據(jù)區(qū)域的調(diào)整。

（三）邊距參數(shù)設(shè)置不合適

這里貼圖邊距的配置往往最容易被忽略，一般來說這里我們的邊距設(shè)置需要很小，如0.08，如果邊距數(shù)據(jù)過大，就會(huì)導(dǎo)致對(duì)應(yīng)的偏移過大，甚至偏離畫面區(qū)域。

為了規(guī)避這類問題，我們也給大家梳理了三個(gè)技巧，讓大家無需調(diào)節(jié)邊距就可以精準(zhǔn)展示貼圖效果

? 制作正方形的貼圖，由于開發(fā)本身組件的設(shè)置邏輯是正方形貼圖，如果使用長(zhǎng)方形貼圖，就會(huì)出現(xiàn)一定的畸變。

? 貼圖處理時(shí)地圖內(nèi)容的「最長(zhǎng)邊」要頂?shù)秸叫萎嫴歼吘?，作為正方形貼圖的邊長(zhǎng)，這里我們以甘肅省為例制作了貼圖畫布的選擇效果。

? 制作2的整數(shù)次方的貼圖，減少平臺(tái)計(jì)算損耗，例如 128、512、1024、2048、4096。

二、制作流程

如果我們想要制作一張完美對(duì)齊、有衛(wèi)星紋理的頂面貼圖，我們需要怎么做呢？首先這里給大家展示一下我們最終的效果。

（一）工具與數(shù)據(jù)準(zhǔn)備

考慮到大家前期貼圖實(shí)際操作配置的便捷性，我們選取了以下在線免費(fèi)使用或者開源的產(chǎn)品進(jìn)行實(shí)操演示：

1、EasyMap（免費(fèi)使用）：用于下載地圖輪廓數(shù)據(jù)

2、QGIS（開源軟件）：坐標(biāo)處理 + 衛(wèi)星紋理生成 + 導(dǎo)出SVG

3、Pixso/MasterGo等（在線）：處理貼圖樣式效果

4、EasyV（免費(fèi)試用）：使用貼圖應(yīng)用于對(duì)應(yīng)地圖組件

額外在QGIS的配置操作中，需要加載在線服務(wù)地圖并進(jìn)行詳細(xì)衛(wèi)星地圖數(shù)據(jù)的處理配置。

? 高德地圖URL：

https://webst01.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}

? arcgis：

https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}

（二）實(shí)操配置

1、基本貼圖獲取

第一步：在EasyMap中下載對(duì)應(yīng)省份的輪廓數(shù)據(jù)以及市級(jí)輪廓數(shù)據(jù)，并解壓文件。

第二步：打開QGIS（建議使用QGIS-LTR版本），根據(jù)不同的使用場(chǎng)景（是否需要詳細(xì)市級(jí)輪廓）選擇對(duì)應(yīng)的輪廓數(shù)據(jù)拖拽上傳。

第三步：將地圖服務(wù)對(duì)接到QGIS，并在右下角中確認(rèn)對(duì)應(yīng)的地圖投影方式。

第四步：調(diào)成輪廓圖層的顏色樣式，導(dǎo)出合適的 2 的整數(shù)次方的正方形圖片。

第五步：在EasyV中選擇對(duì)應(yīng)投影模式后進(jìn)行貼圖上傳，到這里就可以制作出完美對(duì)齊的頂部貼圖。

2、貼圖效果優(yōu)化

第一步：進(jìn)入QGIS中，隱去輪廓部分，導(dǎo)出對(duì)應(yīng)區(qū)域衛(wèi)星地圖（無輪廓）的貼圖。

第二步：在QGIS中顯示對(duì)應(yīng)地圖輪廓，隱去其他圖層，選擇新建畫布并選擇導(dǎo)出為SVG文件。

第三步：將區(qū)域衛(wèi)星地圖（無輪廓）的貼圖、輪廓SVG導(dǎo)入對(duì)應(yīng)的在線設(shè)計(jì)平臺(tái)（這里我們以Mastergo為例），將輪廓SVG解除打組，刪除空白區(qū)域后重新打組，獲得最終輪廓圖。

第四步：將輪廓拖入衛(wèi)星地圖（無輪廓）的貼圖所在的畫布中，按照視頻中的操作，根據(jù)設(shè)計(jì)需求制作貼圖樣式效果（內(nèi)陰影、內(nèi)發(fā)光、顏色效果...）。（具體操作教程可以前往易知微官網(wǎng)學(xué)習(xí)）

第五步：將最終的調(diào)整好的貼圖導(dǎo)出并導(dǎo)入EasyV對(duì)應(yīng)地圖組件中，可以得到完美對(duì)齊的貼圖效果。

第六步：最后根據(jù)大屏的整體顏色風(fēng)格，在EasyV中調(diào)整頂線、底線、側(cè)面、倒影及文字的樣式效果，獲得最終呈現(xiàn)的地圖樣式。

三、常見問題

1、為什么在墨卡托投影下對(duì)齊了，改成 WGS84 不會(huì)自動(dòng)對(duì)齊？

? 投影的改變不是簡(jiǎn)單的拉伸變形。每種投影方式由自己獨(dú)特的規(guī)則，不是簡(jiǎn)單的拉伸變形關(guān)系。所以改了投影，頂面貼圖的對(duì)齊不能自動(dòng)匹配，要重新繪制。

2、為什么還可以上傳頂面貼圖壓縮包？

??壓縮包主要是為每一個(gè)行政區(qū)域單獨(dú)指定貼圖，當(dāng)沒有指定 adcode 的時(shí)候，建議，下鉆后使用同一張通用型貼圖，可以在保證效果的基礎(chǔ)上快速配置。

3、如何制作和使用“通用型”貼圖？

? 即不要求衛(wèi)星紋理和地圖對(duì)應(yīng)，可選擇一個(gè)沒有明顯地理特征的區(qū)域進(jìn)行制作，比如：水利行業(yè)模板，按照上述步驟隱藏輪廓效果即可。

4、如何制作地圖的底面圖？

? 整體制作過程步驟較多，可以直接觀看回放視頻（00:52:10-01:07:00）

5、衛(wèi)星圖出現(xiàn)瓦片缺失怎么辦？

? 縮放比例到?jīng)]有缺失的大小或者直接更換衛(wèi)星圖服務(wù)

更多3D地圖貼圖制作&低代碼數(shù)字平臺(tái)免費(fèi)試用：https://easyv.cloud/?t=bilbili