ol-ext實現3D渲染

之前在專案在需要在openlayers中實現物體的3D立體化展示，故找到了ol-ext外掛，具體實現過程見使用openlayers的擴充套件外掛實現向量圖層的3D渲染，寫這篇部落格的原因也是記錄自己工作中遇到的問題，以及幫助更多需要幫助的人，上一篇部落格中有小夥伴問到一些問題，所以特寫這篇部落格進行一個解答。

問題彙總及解答

1. 設定3D渲染之後沒有效果
   
   解答：(1) ol-ext是基於openlayers的外掛，所以在引入ol-ext之前確保已經正確引入openlayers。

並需要注意，有時候jquery未正確載入，或載入超時也會造成沒有效果。
(2) 調節相關引數

var r3D = new ol.render3D({ height:0, maxResolution:0.6, defaultHeight:3.5 });
//height高度，maxResolution：最大解析度等屬性的影響也會造成對最終結果的一個差異
//，所以可以試試看API文件調節相關的引數

2. 設定之後想要改變其預設樣式
   ol-ext設定三維渲染的預設樣式：
   

修改樣式：
可以在3D渲染出打個斷點，F11一步一步檢視整個渲染過程，包括樣式

發現ol-ext.js中3D渲染的方法中對樣式的設定為this.setStyle(options.style),所以你可以直接修改ol-ext.js中預設的樣式設定（如下圖中最下面兩個紅框所示），也可以在渲染時傳入樣式配置項

修改後樣式如下：

注：在初始化渲染時就新增樣式配置項，參考示例如下，樣式的設定與openlayers一致

/* 20201015 created By qiaozi*/
var style = new ol.style.Style({
		stroke:new ol.style.Stroke({
			color:'rgb(128,234,123)',
			width:2
		}),
		fill:new ol.style.Fill({
			color:'rgba(255,0,0,0.5)'
		})
	})
	var r3D = new ol.render3D({ height:0, maxResolution:0.6, defaultHeight:3.5 ,style:style});
	vector.setRender3D(r3D);

上述程式碼效果圖如下：