繪制功能在Openlayers中比較常用，平時(shí)我們需要手動(dòng)繪制一些點(diǎn)、線、面、多邊形，圓等圖形，Openlayers為我們提供了相關(guān)的API，主要API都在ol/interaction/Draw里面，繪制的API使用起來也比較簡(jiǎn)單，首先創(chuàng)建一個(gè)Draw對(duì)象，然后再使用Map的addInteraction方法添加該對(duì)象，就可以進(jìn)行繪制了，如下面的偽代碼所示：
var draw = new ol.interaction.Draw({
source:sourse,
type:type,
geometryFunction:geometryFunction
})
map.addInteraction(draw);
模式
Draw的繪制模式主要有以下四種：
-
Point：點(diǎn) -
LineString：線 -
Polygon：面 -
Circle：圓
屬性
創(chuàng)建Draw對(duì)象時(shí)，可以在構(gòu)造函數(shù)中傳遞一些參數(shù)，具體的屬性如下所示：
- type：繪制的幾何類型，包括
Point，LineString，Polygon，Circle四種類型。- features：表示繪制的圖形將添加在指定的要素上。
- source：繪制時(shí)指定的數(shù)據(jù)來源。表示繪制的圖形將添加在指定的圖層上。
- stopClick：繪制時(shí)停止為地圖添加的
click,singleclick,doubleclick事件。- maxPoints：最多可以繪制多少個(gè)點(diǎn)，比如設(shè)置成5，在繪制多邊形時(shí)，如果超過了5個(gè)點(diǎn)就不能繪制了。
- minPoints：在完成多邊形環(huán)或線時(shí)，必須指定繪制的點(diǎn)數(shù)。多邊形的默認(rèn)值為3，線段的默認(rèn)值為2
- finishCondition：指定一個(gè)函數(shù)，在繪制完成后調(diào)用，返回一個(gè)
true將完成繪制。- style：指定繪制圖形的樣式。
- geometryFunction：用于指定
geometry，包括兩參數(shù)，分別是coordinates，geometry，返回geometry。通過該方法可以重新構(gòu)建圖形，比如將圓形構(gòu)造成五角星。- geometryName：幾何對(duì)象的名稱。
- condition：在繪制時(shí)監(jiān)聽點(diǎn)擊事件，返回一個(gè)布爾值表示是否處理該點(diǎn)擊事件。
- freehand：手繪線、面等圖形。
- freehandCondition：指定一個(gè)函數(shù)，繪制的時(shí)候當(dāng)鼠標(biāo)移動(dòng)時(shí)將調(diào)用該函數(shù)。
方法
- createBox：當(dāng)
type為Circle時(shí)將geometryFunction設(shè)置成該方法，可以繪制矩形。- createRegularPolygon：當(dāng)
type為Circle時(shí)將geometryFunction設(shè)置成該方法，可以正多邊形。- appendCoordinates：當(dāng)在繪制完線或者多邊形后，還可以通過該方法往圖形中添加坐標(biāo)。
- extend：擴(kuò)展圖片，可以往圖形上再添加一個(gè)圖形，僅限于線條。
- finishDrawing：結(jié)束繪制。
- removeLastPoint：刪除最后一個(gè)坐標(biāo)點(diǎn)。
事件
- drawend：繪制結(jié)束時(shí)觸發(fā)。如
draw.on('drawend',function() {})- drawstart：繪制開始時(shí)觸發(fā)。如
draw.on('drawstart',function() {})
個(gè)人博客
