一、首先了解下矢量地圖和柵格地圖

?

矢量圖使用直線和曲線來描述圖形，這些圖形的元素是一些點(diǎn)、線、矩形、多邊形、圓和弧線等等，矢量地圖放大和縮小不會(huì)失真（圖片你要是放大一定程度明顯可以看出一個(gè)一個(gè)小格→柵格地圖的缺點(diǎn)）。為了便于存儲(chǔ)，傳遞，使用，矢量地圖會(huì)按照一定的格式來表達(dá)，比如常見的GeoJSON，TopoJSON，GML，KML，ShapeFile等等。 除了最后一個(gè)ShapeFile，其他幾個(gè)格式的矢量地圖OpenLayers 3都支持，使用起來也是非常的簡單。

??????????????????????

二、矢量圖層的構(gòu)成

矢量圖層是在客戶端渲染的，在 web 環(huán)境中，對應(yīng)的就是瀏覽器。構(gòu)成一個(gè)矢量圖層的包含一個(gè)數(shù)據(jù)（source）和一個(gè)樣式（style），數(shù)據(jù)構(gòu)成矢量圖層的要素，樣式規(guī)定要素顯示的方式和外觀。一個(gè)初始化成功的矢量圖層包含一個(gè)到多個(gè)要素（feature），每個(gè)要素由地理屬性（geometry）和多個(gè)其他的屬性，可能包含名稱等。

三、初始化圖層：

new ol.layer.Vector({source: new ol.source.Vector({url: '../data/geojson/line-samples.geojson', // 地圖來源format: new ol.format.GeoJSON() // 解析矢量地圖的格式化類})})

• 加載代碼之所以這么簡單，是因?yàn)镺penLayers 3內(nèi)置了對應(yīng)矢量地圖格式的解析類，比如ol.format.GeoJSON。 它們都位于包ol.format下面，可以在API官方文檔中查詢得到。 如果是shapefile這種不支持的，則需要自己解析。 解析后，矢量地圖都會(huì)轉(zhuǎn)換為對應(yīng)于OpenLayers 3中的feature。 所以，當(dāng)加載完成后，可以通過source的getFeatures方法來獲取所有的矢量圖形。
• 需要注意坐標(biāo)系，因?yàn)?geojson文檔里用的是和當(dāng)前地圖用的不一樣的坐標(biāo)系。

四、獲取得要素

那么，在一個(gè)矢量圖層中怎么取得它的某個(gè) feature 呢，一般的想法是 vector.getFeature()，其實(shí)不是的，vector 的數(shù)據(jù)包含在 source 中，要取得 vector 的 feature 數(shù)據(jù)，要在 source 中，例如 vector.getSource().getFeatures()，該函數(shù)會(huì)返回一個(gè) feature array，直接使用 [ ]，取用即可，或者根據(jù)要素的 ID 取得（getFeatureById()）。

??????同樣的，只要數(shù)據(jù)相關(guān)的操作，都要得到 vector 的 source 實(shí)例，然后進(jìn)行操作，例如 添加要素（addFeature）、刪除要素（removeFeature），對每個(gè)要素進(jìn)行相同的操作（forEachFeature）。

五、取得要素的 geometry

? 利用 getGeometry() 可以獲得要素的地理屬性，這個(gè)函數(shù)當(dāng)然返回要素包含的 geometry，geometry 包含很多類型，主要有 point、multi point、linear ring、line string、multi line string、polygon、multi polygon、circle。

??????取得 geometry 后，就可以獲得要素的坐標(biāo)了，可以根據(jù)坐標(biāo)做一些地理判斷，比如判斷 一個(gè)坐標(biāo)是否位于要素內(nèi)（containsCoordinate(coordinate)?或者?containsXY(x, y)），取得要素的中心坐標(biāo)等。

?

轉(zhuǎn)載于:https://www.cnblogs.com/tuboshu/p/10752387.html

總結(jié)

以上是生活随笔為你收集整理的OpenLayer学习之矢量地图的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

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