**對於面要素,想要實現立體效果,之前寫了一篇部落格,新增陰影來實現立體化,但是可能在很多情況下,更加想要的是可以多面要素的邊框進行不同顏色,不同線寬的樣式設定,從而達到立體化的效果。此次所寫的部落格中正是利用了此種方式來實現立體化效果。
利用openlayers新增乙個面要素到圖層中
//新增中國地圖圖層
var chinalayer =
newol.layer.vector()
, visible:
true
, style:
newol.style.style()
})})
; map.
addlayer
(chinalayer)
;//資料路徑
var urlc =
'../data/china.geojson'
;//讀取本地資料
const promise =
newpromise
(function
(resolve, reject)}}
)})//請求成功之後處理的事件
promise.
then
(response =>))
.readfeatures
(response)
;var f = features[0]
; chinalayer.
getsource()
.addfeature
(f);
})
效果圖:
利用面要素的邊框不同顏色,線寬的樣式設定實現立體化
//inner
var innerlayer=
newol.layer.vector()
, style:
newol.style.style()
, fill:
newol.style.fill()
}), zindex:2}
);map.
addlayer
(innerlayer)
;//outer
var outerlayer =
newol.layer.vector()
, style:
newol.style.style()
, fill:
newol.style.fill()
}), zindex:2}
);map.
addlayer
(outerlayer)
;
再將麵要素新增到兩個圖層中,設定zindex層級比原圖低一些。實現的效果圖如下:
本次部落格又提供了一種在openlayer中實現面要素的立體化,這也可能是很多在開發中會遇到的問題,希望可以幫助到更多的小夥伴。
OpenLayers中Util各個函式說明
openlayers.util.getelement 以陣列的形式返回所有引數在document中的dom元素 openlayers.util.getelement的別名 openlayers.util.extend 目標物件,原物件 將原物件中的所有非 undefined 屬性拷貝到目標物件 包括...
Openlayers4中的全屏
openlayers4中,ol.control.fullscreen 可實現地圖的全屏展示,可是當地圖的初始化寬度和高度都不是100 的時候,全屏的時候只會寬度的100 高度還是原來地圖的高度。本文講述如何解決此問題。解決此問題的關鍵還是在於全屏的時候地圖的容器的高度也得變成100 因此,解決 如下...
Collection框架中實現比較要實現什麼介面
comparable和 comparator介面 如果乙個類的不同物件需要比較大小,那麼就需要實現這兩個介面,根據業務需求定義規則。使用區別 1 comparable介面 是需要比較的類實現自己實現,例如 定義的student類需要比較,需要student類自己實現這個介面,實現comparato ...