亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

柵格瓦片屬性值讀取實(shí)踐

syoya / 1991人閱讀

摘要：需求及使用場(chǎng)景鼠標(biāo)點(diǎn)擊柵格瓦片，讀取瓦片屬性信息。分析柵格瓦片本身并不存儲(chǔ)屬性信息，就是一張簡(jiǎn)單的圖片。受到根據(jù)柵格瓦片顏色值推算屬性值思路的啟發(fā)，我們決定使用色值去反推屬性。

需求及使用場(chǎng)景

鼠標(biāo)點(diǎn)擊柵格瓦片，讀取瓦片屬性信息。

分析
柵格瓦片本身并不存儲(chǔ)屬性信息，就是一張簡(jiǎn)單的png圖片。如圖：

要讀取瓦片信息，傳統(tǒng)解決方案即獲取點(diǎn)擊經(jīng)緯度，去數(shù)據(jù)庫(kù)查詢。拿到經(jīng)緯度后怎么查到想要的信息，也是個(gè)問(wèn)題。
受到mapbox根據(jù)柵格瓦片顏色值推算屬性值思路的啟發(fā)，我們決定使用色值去反推屬性。
我們知道，arcgis等gis軟件處理的柵格數(shù)據(jù)，可利用unique色值著色屬性值，達(dá)到的效果就是色值與屬性的一對(duì)一關(guān)系。我們就利用這種一對(duì)一的關(guān)系，用顏色值推取屬性值。

詳細(xì)計(jì)算過(guò)程
第1階段： 注意mapboxgl不能監(jiān)聽柵格圖層點(diǎn)擊事件，而監(jiān)聽map對(duì)象的click事件，也獲取不到點(diǎn)擊的圖層名稱。但是能拿到我們需要的經(jīng)緯度坐標(biāo)lnglat

map.on("click", this.mapClickCb) 
mapClickCb(e){  
    let lngLat = e.lngLat;
}

第2階段：利用經(jīng)緯度lnglat、當(dāng)前級(jí)別zoom獲取瓦片行列號(hào)，如下：

 let z= Math.round(map.getZoom()); 
 let x =TileUtil.longitudeToTileX(lngLat.lng,z); 
 let y =TileUtil.latitudeToTileY(lngLat.lat,z);

第3階段：利用經(jīng)緯度計(jì)算點(diǎn)擊位置在瓦片里的像素行列號(hào)，如下

let pixelX=TileUtil._lngToPixelX(lngLat.lng,z); 
let pixelY=TileUtil._latToPixelY(lngLat.lat,z);

第4階段：利用獲取到的瓦片和像素行列號(hào)，獲取對(duì)應(yīng)位置像素值

//以mapbox提供的DEM數(shù)據(jù)為例 
let srcUrl="https://api.mapbox.com/v4/mapbox.terrain-rgb/"+z+"/"+x+"/"+y+".pngraw?access_token=pk.eyJ1IjoiZml5YXoiLCJhIjoiY2plODVuMmJ4MDdhMzJ3bXhqZGhsanphNCJ9.6RJUjc1MKjgBJJzfyQ_dUw"
map.loadImage(srcUrl, (error, image) =>{  
   if(error){    
      this.$message.error(error.status)    
      return   
   }
   let canvas= document.createElement("canvas");  
   canvas.width=image.width;  
   canvas.height=image.height;   
   let context=canvas.getContext("2d");  
   //context.drawImage(image,0,0);  
   let data=context.getImageData(pixelX,pixelY,1,1); //獲取點(diǎn)擊位置的像素值  
   let rgb=data.data.slice(0,3) //獲取到RGB值   
   let height = -10000 + ((rgb[0] * 256 * 256 + rgb[1] * 256 + rgb[2]) * 0.1) //反算高程值 
});

參考文章：
mapbox是如何通過(guò)RGB去解算高程的
相關(guān)計(jì)算函數(shù)看這篇

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/105576.html

相關(guān)文章

  • 慕課網(wǎng)_《如何使用高德云圖在線制作屬于你的地圖》學(xué)習(xí)總結(jié)

    摘要：時(shí)間年月日星期日說(shuō)明本文部分內(nèi)容均來(lái)自慕課網(wǎng)。用戶可以在服務(wù)器端調(diào)用云存儲(chǔ)云檢索從而構(gòu)建自己的存儲(chǔ)和檢索服務(wù)，甚至可以制作自己的數(shù)據(jù)管理臺(tái)。 時(shí)間：2017年08月13日星期日說(shuō)明：本文部分內(nèi)容均來(lái)自慕課網(wǎng)。@慕課網(wǎng)：http://www.imooc.com教學(xué)源碼：無(wú)學(xué)習(xí)源碼：https://github.com/zccodere/s... 第一章：云圖產(chǎn)品介紹 1-1 云圖產(chǎn)品介紹...

    k00baa 評(píng)論0 收藏0

  • 慕課網(wǎng)_《如何使用高德云圖在線制作屬于你的地圖》學(xué)習(xí)總結(jié)

    摘要：時(shí)間年月日星期日說(shuō)明本文部分內(nèi)容均來(lái)自慕課網(wǎng)。用戶可以在服務(wù)器端調(diào)用云存儲(chǔ)云檢索從而構(gòu)建自己的存儲(chǔ)和檢索服務(wù)，甚至可以制作自己的數(shù)據(jù)管理臺(tái)。 時(shí)間：2017年08月13日星期日說(shuō)明：本文部分內(nèi)容均來(lái)自慕課網(wǎng)。@慕課網(wǎng)：http://www.imooc.com教學(xué)源碼：無(wú)學(xué)習(xí)源碼：https://github.com/zccodere/s... 第一章：云圖產(chǎn)品介紹 1-1 云圖產(chǎn)品介紹...

    afishhhhh 評(píng)論0 收藏0

  • 下一代的 3D Tiles 前瞻

    摘要：在中，引入一些元數(shù)據(jù)方面的擴(kuò)展項(xiàng)。不同層級(jí)的元數(shù)據(jù)像素級(jí)別樣式化渲染不同層級(jí)的元數(shù)據(jù)像素級(jí)別樣式化渲染配合使用和兩個(gè)擴(kuò)展項(xiàng)，下一代的可以在各個(gè)層級(jí)存儲(chǔ)元數(shù)據(jù)。例如，水泥地和草地的摩擦系數(shù)可以作為元數(shù)據(jù)，影響車輛的行駛速度等。下一代的 3D Tiles 前瞻原文：Introducing 3D Tiles Next, Streaming Geospatial to the Metaverse原文...

    魏明 評(píng)論0 收藏0

  • python-GDAL之空間數(shù)據(jù)處理-自帶工具集

    摘要：自帶了很多實(shí)用方便的工具，方便大家直接使用。按照切片服務(wù)規(guī)則生成切片數(shù)據(jù)元數(shù)據(jù)地圖瀏覽網(wǎng)頁(yè)。還可以按照投影創(chuàng)建的元數(shù)據(jù)文件。對(duì)影像執(zhí)行平移銳化增強(qiáng)操作以后版本才有此工具對(duì)兩幅影像進(jìn)行差異檢測(cè)，包括像素和元數(shù)據(jù)的檢查。 ...

    DataPipeline 評(píng)論0 收藏0

  • vue下實(shí)現(xiàn)input實(shí)現(xiàn)圖片上傳，壓縮，拼接以及旋轉(zhuǎn)

    摘要：背景作為一名前端工作人員，相信大家在開發(fā)系統(tǒng)的時(shí)候，經(jīng)常有遇到需要這么一種需求，就是需要為用戶保存上傳的圖片，很多小白遇到這個(gè)問(wèn)題的時(shí)候，都會(huì)虎軀一震，以為會(huì)是一個(gè)棘手的問(wèn)題，當(dāng)你讀完這篇文章的時(shí)候，你會(huì)發(fā)現(xiàn)都是你瞎操作了，真相就是這么簡(jiǎn)單 背景 作為一名前端工作人員，相信大家在開發(fā)系統(tǒng)的時(shí)候，經(jīng)常有遇到需要這么一種需求，就是需要為用戶保存上傳的圖片，很多小白遇到這個(gè)問(wèn)題的時(shí)候，都會(huì)虎...

    megatron 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<