查詢

????查詢是WebGIS中最常用的核心功能之一，廣泛應(yīng)用于各類項(xiàng)目中。通過對(duì)空間和屬性要素的查詢，提取需要的信息，與地圖聯(lián)動(dòng)進(jìn)行展示，滿足應(yīng)用的需求。

????查詢定位在應(yīng)用中很常見，根據(jù)不同的應(yīng)用需求，可以選擇不同的查詢方式、實(shí)現(xiàn)方式以及表現(xiàn)方式。查詢方式：基于GIS的特性，查詢主要包括幾何查詢、屬性條件查詢以及兩者結(jié)合的復(fù)合查詢，以及OID查詢。

• 幾何查詢有點(diǎn)擊、畫線、畫圓、拉框、多邊形五種操作方式，以操作的空間范圍作為限定條件進(jìn)行查詢；

• 屬性條件查詢以要素屬性限定條件進(jìn)行查詢；

• 復(fù)合查詢則是兩者的結(jié)合，空間范圍組合屬性條件，統(tǒng)一查詢滿足要求的空間要素；

• 
  

• OID查詢：根據(jù)地圖要素的唯一標(biāo)識(shí)OID進(jìn)行查詢；

類名/方法名API說明CesiumZondy.Query.MapDocQuery / beginQuery()二維地圖文檔查詢，支持幾何、屬性、OID查詢CesiumZondy.Query.G3DDocQuery / queryG3DFeature()三維模型數(shù)據(jù)查詢，支持幾何、屬性、OID查詢CesiumZondy.Manager.AnalysisManager / startCustomDisplay()M3D單體查詢，模型高亮/M3D交互編輯

二維地圖文檔查詢

????基于二維地圖文檔的要素查詢，提供幾何、屬性、OID查詢方式，以及復(fù)合查詢，即查詢?nèi)S場(chǎng)景中加載的二維地圖文檔的要素信息，包括要素的幾何信息與屬性信息。

????具體實(shí)現(xiàn)：先初始化查詢參數(shù)CesiumZondy.Query.MapDocQuery類對(duì)象，設(shè)置查詢屬性條件等參數(shù)后，調(diào)用beginQuery()方法進(jìn)行查詢，然后在回調(diào)中獲取處理查詢到的要素信息，解析所需的幾何信息與屬性信息進(jìn)行展示。

????以屬性查詢?yōu)槔?/p>

• Example：

  var queryParam = new CesiumZondy.Query.MapDocQuery()//查詢圖層的URL路徑//queryParam.gdbp = encodeURI("gdbp://MapGisLocal/北京市/ds/行政區(qū)/sfcls/北京市");queryParam.docName = '北京市'queryParam.mapIndex = 0queryParam.layerID = 0queryParam.structs = '{"IncludeAttribute":true,"IncludeGeometry":true,"IncludeWebGraphic":false}'//設(shè)置要素的屬性條件queryParam.where = "省名='北京'"//服務(wù)器的ipqueryParam.ip = ip queryParam.port = port queryParam.beginQuery( ?function(result) { ? ?//查詢結(jié)果處理 ?}, ?function quryError(err) { ? ?alert(err) ?})if (result != null) { ?data = result ?//解析顯示要素的屬性信息 ?document.getElementById('code').value = result.SFEleArray[0].AttValue[2] ?document.getElementById('name').value = result.SFEleArray[0].AttValue[3] ?document.getElementById('spell').value = result.SFEleArray[0].AttValue[4] ?document.getElementById('population').value = result.SFEleArray[0].AttValue[40] ?//解析要素的幾何信息 ?var GeompointArray = new Array() ?for (var pointlength = 0; pointlength < result.SFEleArray[0].fGeom.RegGeom[0].Rings[0].Arcs[0].Dots.length; pointlength++) { ? ?var PntCartesian3 = Cesium.Cartesian3.fromDegrees(result.SFEleArray[0].fGeom.RegGeom[0].Rings[0].Arcs[0].Dots[pointlength].x, result.SFEleArray[0].fGeom.RegGeom[0].Rings[0].Arcs[0].Dots[pointlength].y, 10) ? ?GeompointArray.push(PntCartesian3) ?} ?GeompointArray.push(GeompointArray[0]) ?//構(gòu)造幾何繪制控制對(duì)象 ?var entityController = new CesiumZondy.Manager.EntityController({ ? ?viewer: webGlobe.viewer, ?}) ?//構(gòu)造區(qū)對(duì)象 ?var polygon = { ? ?name: '立體區(qū)', ? ?polygon: { ? ? ?//坐標(biāo)點(diǎn) ? ? ?hierarchy: GeompointArray, ? ? ?//是否指定各點(diǎn)高度 ? ? ?perPositionHeight: true, ? ? ?//顏色 ? ? ?material: new Cesium.Color(33 / 255, 150 / 255, 243 / 255, 0.5), ? ? ?//輪廓線是否顯示 ? ? ?outline: true, ? ? ?//輪廓線顏色 ? ? ?outlineColor: Cesium.Color.BLACK, ? ?}, ?} ?//繪制圖形通用方法：對(duì)接Cesium原生特性 ?var stericPolygon = entityController.appendGraphics(polygon)}

三維模型數(shù)據(jù)查詢

????基于三維模型數(shù)據(jù)的要素查詢，提供幾何、屬性、OID查詢方式，以及復(fù)合查詢，即查詢?nèi)S場(chǎng)景中加載的三維模型數(shù)據(jù)的要素信息，包括三維模型數(shù)據(jù)的屬性、幾何等要素信息。

????具體實(shí)現(xiàn)：先構(gòu)造CesiumZondy.Query.G3DDocQuery三維地圖文檔查詢對(duì)象，配置相關(guān)參數(shù)后調(diào)用?queryG3DFeature方法執(zhí)行查詢，然后在回調(diào)中獲取處理查詢到的要素信息，并在三維場(chǎng)景中展示。

????以幾何查詢?yōu)槔?/p>

• Example:

  var queryParam = new CesiumZondy.Query.G3DDocQuery()//查詢圖層的URL路徑queryParam.gdbp = encodeURI('gdbp://MapGisLocal/示例數(shù)據(jù)/ds/三維示例/sfcls/景觀_模型')//設(shè)置查詢結(jié)果結(jié)構(gòu)queryParam.structs = '{"IncludeAttribute":true,"IncludeGeometry":true,"IncludeWebGraphic":false}'//幾何查詢//設(shè)置查詢方式queryParam.geometryType = 'Point3D'//設(shè)置查詢的點(diǎn)坐標(biāo)queryParam.geometry = 92.37674872254775 + ',' + 163.57024299752067 + ',' + 21//服務(wù)器的ipqueryParam.serverIp = ip queryParam.serverPort = port queryParam.queryG3DFeature( ?function(result) {}, ?function(err) {})

M3D單體查詢

????M3D單體查詢，針對(duì)的是M3D數(shù)據(jù)，實(shí)現(xiàn)在三維場(chǎng)景中展示 M3D 模型數(shù)據(jù)并實(shí)現(xiàn)單體查詢功能。

????具體實(shí)現(xiàn)：結(jié)合鼠標(biāo)點(diǎn)擊事件，在點(diǎn)擊事件回調(diào)函數(shù)中先通過Cesium.WebSceneControl.Scene類的pick()方法來選取要素，然后調(diào)用CesiumZondy.Manager.AnalysisManager類的startCustomDisplay()方法來實(shí)現(xiàn)模型高亮。

• Example:

  //構(gòu)造鼠標(biāo)事件管理對(duì)象var mouseEventManager = new CesiumZondy.Manager.MouseEventManager({ ?viewer: webGlobe.viewer,})//注冊(cè)鼠標(biāo)左鍵單擊事件mouseEventManager.registerMouseEvent('LEFT_CLICK', highlightPicking)

• Example:

  /*鼠標(biāo)左鍵單擊事件回調(diào)：模型高亮*/function highlightPicking(movement) { ?//根據(jù)鼠標(biāo)點(diǎn)擊位置選擇對(duì)象 ?var pickedFeature = webGlobe.scene.pick(movement.position) ?//獲取要素的瓦片集 ?var currentLayer = [pickedFeature.tileset] ?//獲取名稱屬性 ?var title = pickedFeature.getProperty('name') ?//采用_分割 ?var values = title.split('_') ?//獲取數(shù)組中第三個(gè)數(shù)值，即為要素的ID ?var vlueNumber = parseInt(values[2]) ?//構(gòu)建數(shù)組 ?var idList = [vlueNumber] ?//構(gòu)建參數(shù)：設(shè)置顏色 ?var options = { ? ?//高亮顏色 ? ?color: new Cesium.Color(255 / 255, 255 / 255, 0 / 255, 1), ? ?//高亮模式：REPLACE為替換 ? ?colorBlendMode: Cesium.Cesium3DTileColorBlendMode.REPLACE, ?} ?//構(gòu)造分析功能管理對(duì)象 ?var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ?viewer: webGlobe.viewer, ?}) ?//開始閃爍查找到的模型 ?analysisManager.startCustomDisplay(currentLayer, idList, options)}

分析

????具備全空間一體化分析能力，提供模型壓平、動(dòng)態(tài)剖切等專業(yè)分析功能；提供可視域分析、地形開挖、洪水淹沒分析、填挖方計(jì)算等地形分析功能。

類名/方法名API說明Cesium.VisiblityAnalysis()通視分析CesiumZondy.Manager.AnalysisManager / createDynamicCutting()動(dòng)態(tài)剖切、開挖分析、卷簾分析CesiumZondy.Manager.AdvancedAnalysisManager / createFlood()洪水淹沒分析CesiumZondy.Manager.AdvancedAnalysisManager / createViewshedAnalysis()可視域分析CesiumZondy.Manager.AdvancedAnalysisManager / createSkyLine()天際線分析CesiumZondy.Manager.AdvancedAnalysisManager / createSceneProjector()視頻投放CesiumZondy.Manager.AdvancedAnalysisManager / createModelFlatten()模型壓平CesiumZondy.Manager.AdvancedAnalysisManager / createAspectAnalysis()坡向分析CesiumZondy.Manager.AdvancedAnalysisManager / createSlopeAnalysis()坡度分析CesiumZondy.Manager.AdvancedAnalysisManager / createCutFill()、startCutFill()填挖方計(jì)算CesiumZondy.Manager.AdvancedAnalysisManager / createAnimation()動(dòng)畫漫游

通視分析

????通視分析，用于檢測(cè)當(dāng)前三維場(chǎng)景中兩點(diǎn)之間是否可以沒有阻礙的看到。

????具體實(shí)現(xiàn)：通過 Cesium 三維球控件?Cesium.WebSceneControl()?對(duì)象的?registerMouseEvent()?方法在三維場(chǎng)景里面自定義注冊(cè)鼠標(biāo)事件完成通視分析兩個(gè)點(diǎn)的拾取，通過兩點(diǎn)通視分析對(duì)象?Cesium.VisiblityAnalysis()實(shí)現(xiàn)兩點(diǎn)通視分析。

Step 1.?創(chuàng)建通視分析：
????初始化兩點(diǎn)通視分析對(duì)象?Cesium.VisiblityAnalysis()?;

• Example:

  //初始化通視分析類visiblity = new Cesium.VisiblityAnalysis();

Step 2.?添加通視分析：
????將兩點(diǎn)通視分析對(duì)象?Cesium.VisiblityAnalysis()?添加到 Cesium 三維球控件中;

• Example:

  //添加通視分析顯示viewer.scene.VisualAnalysisManager.add(visiblity);

Step 3.?注冊(cè)鼠標(biāo)事件：
????調(diào)用 Cesium 三維球控件?Cesium.WebSceneControl()?的?registerMouseEvent()?方法注冊(cè)鼠標(biāo)事件, 以下事例中的匿名函數(shù)為觸發(fā)鼠標(biāo)事件后執(zhí)行的方法，完成此步后，在三維場(chǎng)景中點(diǎn)擊鼠標(biāo)左鍵可觸發(fā)點(diǎn)擊事件，點(diǎn)擊完成后進(jìn)入匿名函數(shù)；

• Example:

  //注冊(cè)事件webGlobe.registerMouseEvent('LEFT_CLICK', function(e) {});webGlobe.registerMouseEvent('RIGHT_CLICK', function(e) {});webGlobe.registerMouseEvent('MOUSE_MOVE', ?function(e) {});

Step 4.?設(shè)置兩點(diǎn)通視分析參數(shù)：
????給兩點(diǎn)通視分析對(duì)象設(shè)置進(jìn)行兩點(diǎn)通視分析使用的必要參數(shù)。

• Example:

  //設(shè)置通視分析觀察點(diǎn) visiblity.viewPosition = cartesian; //設(shè)置通視分析結(jié)果點(diǎn) visiblity.targetPosition = cartesian;

動(dòng)態(tài)剖切

????此功能對(duì)已加載的M3D數(shù)據(jù)進(jìn)行任意距離的剖切，動(dòng)態(tài)的顯示或隱藏一部分?jǐn)?shù)據(jù)。

????具體實(shí)現(xiàn)：創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建剖切對(duì)象實(shí)例，通過設(shè)置剖切面距離進(jìn)行數(shù)據(jù)剖切分析。

Step 1.?創(chuàng)建切面：
????初始化切面對(duì)象?Cesium.ClippingPlane()?;

• Example:

  //進(jìn)行剖切分析的面，從上往下切，Cesium.Cartesian3中第一個(gè)參數(shù)是左右，第二個(gè)參數(shù)是前后，第三個(gè)參數(shù)是上下var plane = new Cesium.ClippingPlane(new Cesium.Cartesian3(0.0, 0.0, -1.0), -500.0)

Step 2.?獲取剖切切面：
????創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建剖切對(duì)象實(shí)例, 并獲取剖切切面；

• Example:

  //初始化分析功能管理類 var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ? viewer: webGlobe.viewer }); //創(chuàng)建剖切對(duì)象實(shí)例 dynaCut = analysisManager.createDynamicCutting(landscapeLayer, [plane], { ? ? color: new Cesium.Color(0.0, 1.0, 1.0, 0.3) });

Step 3.?設(shè)置剖切面距離：
????通過設(shè)置切面回調(diào)函數(shù)，動(dòng)態(tài)設(shè)置剖切面距離完成動(dòng)態(tài)剖切分析。

• Example:

  //設(shè)置切面回調(diào)函數(shù)dynaCut.planes[0].plane.plane = new Cesium.CallbackProperty(function(date) { ? ?//設(shè)置剖切面距離 ? ?plane.distance = distance; ? ?return Cesium.Plane.transform(plane, landscapeLayer[0].modelMatrix, new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_X, 0.0));}, false);

開挖分析

????開挖分析，指對(duì)已加載的M3D數(shù)據(jù)進(jìn)行任意距離深度開挖，動(dòng)態(tài)的顯示或隱藏一部分?jǐn)?shù)據(jù)。

????具體實(shí)現(xiàn)： 先初始化M3D模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法加載M3D數(shù)據(jù)后，再創(chuàng)建?Cesium.ClippingPlane()?切面對(duì)象，創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建開挖分析對(duì)象通過設(shè)置剖切面距離進(jìn)行數(shù)據(jù)開挖分析。

Step 1.?加載數(shù)據(jù)：
????初始化M3D模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法傳入M3D數(shù)據(jù)服務(wù)地址，即可加載瀏覽數(shù)據(jù)；

• Example:

  //構(gòu)造M3D模型層管理對(duì)象var m3dLayer = new CesiumZondy.Layer.M3DLayer({ ? ?viewer: webGlobe.viewer});var drilllayer = m3dLayer.append( ? ?"http://develop.smaryun.com:6163/igs/rest/g3d/鉆孔_2_鉆孔模型s", { ? ? ? ?autoReset: false, ? ?});//加載M3D地圖文檔（服務(wù)地址，配置參數(shù)）landscapeLayer = m3dLayer.append('http://develop.smaryun.com:6163/igs/rest/g3d/鉆孔分層點(diǎn)_Sur_000_Ent', {});

Step 2.?創(chuàng)建切面：
????初始化切面對(duì)象?Cesium.ClippingPlane()?;

• Example:

  //開挖面設(shè)置,這五個(gè)面分別表示前后左右，底面，其中底面用于控制開挖深度 var clippingPlanes = [ ? ? new Cesium.ClippingPlane(new Cesium.Cartesian3(3, 0.0, 0.0), -1500.0), ? ? new Cesium.ClippingPlane(new Cesium.Cartesian3(-3, 0.0, 0.0), -1500.0), ? ? new Cesium.ClippingPlane(new Cesium.Cartesian3(0.0, 3, 0.0), -1500.0), ? ? new Cesium.ClippingPlane(new Cesium.Cartesian3(0.0, -3, 0.0), -1500.0), ? ? new Cesium.ClippingPlane(new Cesium.Cartesian3(0.0, 0.0, -5), 0.0) ]

Step 3.?創(chuàng)建開挖分析：
????化M3D模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法加載M3D數(shù)據(jù)后，創(chuàng)建?Cesium.ClippingPlane()?切面對(duì)象，創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建開挖分析對(duì)象, 并獲取剖切切面；

• Example:

  //初始化分析功能管理類 ?var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ? ?viewer: webGlobe.viewer ?}); ?//創(chuàng)建開挖分析實(shí)例 ?dynaCut = analysisManager.createExcavateAnalysis({ ? ? ?//圖層信息 ? ? ?tileSet: landscapeLayer[0], ? ? ?//開挖面的形狀 ? ? ?planes: planes, ? ? ?//裁剪面材質(zhì) ? ? ?material: new Cesium.Color(0.2, 0.4, 0.3, 0.7), ? ? ?//邊界線顏色 ? ? ?edgeColor: new Cesium.Color(0.2, 0.4, 0.3, 0.7), ? ? ?//邊界線寬度 ? ? ?edgeWidth: 3, ? ? ?//裁減法線方向，默認(rèn)值為 false ? ? ?unionClippingRegions: false, ? ? ?//開挖坐標(biāo) ? ? ?longitude: 113.0402, ? ? ?latitude: 30.0264, ? ? ?height: 0 ?});

Step 4.?設(shè)置剖切面距離：
????通過設(shè)置切面回調(diào)函數(shù)，動(dòng)態(tài)設(shè)置剖切面距離完成動(dòng)態(tài)剖切分析。

• Example:

  dynaCut.planes[0].plane.plane = new Cesium.CallbackProperty(function(date) { ? ?console.log(planes); ? ?for (var i = 0; i < planes.length; i++) { ? ? ? ?if (i === planes.length - 1) { ? ? ? ? ? ?var plane = planes[i]; ? ? ? ? ? ?plane.distance = distance; ? ? ? ? ? ?Cesium.Plane.transform(plane, landscapeLayer[0].modelMatrix, new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_X, 0.0)); ? ? ? ?} ? ?}}, false);

卷簾分析

????卷簾分析目前通過剖切功能實(shí)現(xiàn)，即對(duì)已加載的兩個(gè)M3D數(shù)據(jù)進(jìn)行任意距離的剖切，動(dòng)態(tài)的顯示或隱藏一部分?jǐn)?shù)據(jù)，一個(gè)顯示的同時(shí)不顯示另一個(gè)數(shù)據(jù)，打到卷簾效果。

????具體實(shí)現(xiàn)：創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建兩個(gè)M3D數(shù)據(jù)的切面對(duì)象通過設(shè)置剖切面距離進(jìn)行數(shù)據(jù)剖切分析，實(shí)現(xiàn)卷簾效果。

Step 1.?創(chuàng)建切面對(duì)象：
????創(chuàng)建切面對(duì)象?Cesium.ClippingPlane()?;

• Example:

  //進(jìn)行剖切分析的面，向右切 var plane = new Cesium.ClippingPlane(new Cesium.Cartesian3(1, 0, 0), -200.0) //進(jìn)行剖切分析的面，向左切 var plane1 = new Cesium.ClippingPlane(new Cesium.Cartesian3(-1, 0, 0), -200.0)

Step 2.?創(chuàng)建剖切對(duì)象：
????創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?createDynamicCutting()?方法創(chuàng)建剖切對(duì)象實(shí)例, 并獲取剖切切面；

• Example:

  //初始化分析功能管理類 var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ? viewer: webGlobe.viewer }); //創(chuàng)建剖切對(duì)象實(shí)例 dynaCut = analysisManager.createDynamicCutting(landscapeLayer, [plane], { ? ? color: new Cesium.Color(0.0, 1.0, 1.0, 0.3) });

Step 3.?通過切面回調(diào)完成動(dòng)態(tài)剖切分析：
????通過設(shè)置切面回調(diào)函數(shù)，動(dòng)態(tài)設(shè)置剖切面距離完成動(dòng)態(tài)剖切分析。

• Example:

  //設(shè)置切面回調(diào)函數(shù)planetEntity.plane.plane = new Cesium.CallbackProperty(function(date) { ? ?//設(shè)置剖切面距離 ? ?plane.distance = distance; ? ?return Cesium.Plane.transform(plane, tileset[0].modelMatrix, new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_X, 0.0));}, false);//設(shè)置切面回調(diào)函數(shù)planetEntity1.plane.plane = new Cesium.CallbackProperty(function(date) { ? ?//設(shè)置剖切面距離 ? ?plane1.distance = distance1; ? ?return Cesium.Plane.transform(plane1, tileset[0].modelMatrix, new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_X, 0.0));}, false);

洪水淹沒分析

????洪水淹沒分析，即在三維場(chǎng)景下動(dòng)態(tài)模擬洪水淹沒分析的場(chǎng)景，根據(jù)設(shè)定的高程與范圍分析洪水淹沒區(qū)域，可應(yīng)用在抗洪搶險(xiǎn)、水庫(kù)管理等領(lǐng)域，輔助決策。支持三維模型、地形等數(shù)據(jù)應(yīng)用場(chǎng)景。

????具體實(shí)現(xiàn)：初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createFlood()?方法創(chuàng)建洪水淹沒分析示例，將結(jié)果顯示到三維球控件上。

Step 1.?創(chuàng)建洪水淹沒分析：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createFlood()?方法創(chuàng)建洪水淹沒分析示例；

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: viewer});//初始化洪水淹沒分析類flood = advancedAnalysisManager.createFlood();//設(shè)置洪水淹沒分析區(qū)域點(diǎn)集flood.dotsList = newArray;//設(shè)置洪水淹沒區(qū)域最底高度flood.minHeight = Number(document.getElementById('minHeight').value <= 0 ? 0 : document.getElementById('minHeight').value);//設(shè)置洪水淹沒區(qū)域最高高度flood.maxHeight = Number(document.getElementById('maxHeight').value <= 0 ? 30 : document.getElementById('maxHeight').value);//設(shè)置洪水上漲速度flood.floodSpeed = Number(document.getElementById('floodSpeed').value <= 0 ? 1 : document.getElementById('floodSpeed').value);//水紋頻率 指波浪的個(gè)數(shù)flood.frequency = Number(document.getElementById('frequency').value <= 0 ? 1000 : document.getElementById('frequency').value);//水紋速度flood.animationSpeed = Number(document.getElementById('animationSpeed').value <= 0 ? 0.01 : document.getElementById('animationSpeed').value);//水波的高度flood.amplitude = Number(document.getElementById('amplitude').value <= 0 ? 10 : document.getElementById('amplitude').value);//指定水面顏色 和 透明度flood.floodColor = new Cesium.Color(0.2, 0.5, 0.4, 0.7);// 指定光線強(qiáng)度flood.specularIntensity = 3.0;

Step 2.?洪水淹沒結(jié)果顯示：
????將結(jié)果顯示到三維球控件上。

• Example:

  //添加洪水淹沒結(jié)果顯示webGlobe.scene.VisualAnalysisManager.add(flood);

可視域分析

????可視域分析，用于檢測(cè)當(dāng)前三維場(chǎng)景中某個(gè)點(diǎn)朝一個(gè)方向看的時(shí)候可以看到的區(qū)域。

????具體實(shí)現(xiàn)：先通過 Cesium 三維球控件?Cesium.WebSceneControl()?對(duì)象的?registerMouseEvent()?方法在三維場(chǎng)景里面自定義注冊(cè)鼠標(biāo)事件完成可視域分析點(diǎn)的拾?。蝗缓蟪跏蓟呒?jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createViewshedAnalysis()?方法實(shí)現(xiàn)可視域分析。

Step 1.?加載數(shù)據(jù)：
????初始化 M3D 模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法傳入 M3D 數(shù)據(jù)服務(wù)地址，即可加載瀏覽數(shù)據(jù)；

• Example:

  //構(gòu)造M3D模型層管理對(duì)象var m3dLayer = new CesiumZondy.Layer.M3DLayer({ ? ?viewer: webGlobe.viewer});//加載M3D地圖文檔（服務(wù)地址，配置參數(shù)）landscapeLayer = m3dLayer.append('http://develop.smaryun.com:6163/igs/rest/g3d/ZondyModels', {});

Step 2.?創(chuàng)建可視域分析：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createViewshedAnalysis()?方法實(shí)現(xiàn)可視域分析;

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: viewer});//創(chuàng)建可視化分析對(duì)象viewshed3d = advancedAnalysisManager.createViewshedAnalysis();

Step 3.?注冊(cè)鼠標(biāo)事件：
????調(diào)用 Cesium 三維球控件?Cesium.WebSceneControl()?的?registerMouseEvent()?方法注冊(cè)鼠標(biāo)事件, 以下事例中的匿名函數(shù)為觸發(fā)鼠標(biāo)事件后執(zhí)行的方法，完成此步后，在三維場(chǎng)景中點(diǎn)擊鼠標(biāo)左鍵可觸發(fā)點(diǎn)擊事件，點(diǎn)擊完成后進(jìn)入匿名函數(shù)；

• Example:

  //注冊(cè)事件webGlobe.registerMouseEvent('LEFT_CLICK', function(e) {});webGlobe.registerMouseEvent('RIGHT_CLICK', function(e) {});webGlobe.registerMouseEvent('MOUSE_MOVE', function(e) {});

Step 4.?設(shè)置可視域分析參數(shù)：
????給可視域分析對(duì)象設(shè)置進(jìn)行可視域分析使用的必要參數(shù)；

• Example:

  //設(shè)置觀察點(diǎn)坐標(biāo)viewshed3d.viewPosition = cartesian;//設(shè)置可視域結(jié)果點(diǎn)viewshed3d.targetPosition = cartesian;

Step 5.?添加可視域分析：
????將可視域分析對(duì)象?Cesium.ViewshedAnalysis()?添加到 Cesium 三維球控件中。

• Example:

  //添加可視域分析結(jié)果顯示viewer.scene.VisualAnalysisManager.add(viewshed3d);

天際線分析

????天際線分析，用于檢測(cè)當(dāng)前視角的天際線，并繪制在三維場(chǎng)景中。

????具體實(shí)現(xiàn)：先初始化 M3D 模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法加載 M3D 數(shù)據(jù)后，再初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createSkyLine()?方法創(chuàng)建天際線分析。

Step 1.?加載數(shù)據(jù)：
????初始化 M3D 模型層管理類?CesiumZondy.Layer.M3DLayer?并調(diào)用?append()?方法傳入 M3D 數(shù)據(jù)服務(wù)地址，即可加載瀏覽數(shù)據(jù)；

• Example:

  //構(gòu)造M3D模型層管理對(duì)象var m3dLayer = new CesiumZondy.Layer.M3DLayer({ ? ?viewer: webGlobe.viewer});//加載M3D地圖文檔（服務(wù)地址，配置參數(shù)）landscapeLayer = m3dLayer.append('http://develop.smaryun.com:6163/igs/rest/g3d/ZondyModels', {});

Step 2.?創(chuàng)建天際線分析：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createSkyLine()?方法創(chuàng)建天際線分析。

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: webGlobe.viewer});//創(chuàng)建天際線實(shí)例skyLineAn = advancedAnalysisManager.createSkyLine()

視頻投放

????視頻投放，即在三維場(chǎng)景中加載色塊、圖片、視屏等功能。

????具體實(shí)現(xiàn)：主要初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createSceneProjector?方法創(chuàng)建場(chǎng)景投放示例，實(shí)現(xiàn)場(chǎng)景投影分析。

Step 1.?創(chuàng)建場(chǎng)景投影對(duì)象：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createSceneProjector()?方法創(chuàng)建場(chǎng)景投放示例;

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: viewer});//初始化場(chǎng)景投影對(duì)象scenePro = advancedAnalysisManager.createSceneProjector(2);

Step 2.?注冊(cè)鼠標(biāo)事件：
????調(diào)用Cesium三維球控件?Cesium.WebSceneControl()?的?registerMouseEvent()?方法注冊(cè)鼠標(biāo)事件, 以下事例中的匿名函數(shù)為觸發(fā)鼠標(biāo)事件后執(zhí)行的方法，完成此步后，在三維場(chǎng)景中點(diǎn)擊鼠標(biāo)左鍵可觸發(fā)點(diǎn)擊事件，點(diǎn)擊完成后進(jìn)入匿名函數(shù)；

• Example:

  //注冊(cè)事件webGlobe.registerMouseEvent('LEFT_CLICK', function(e) {});webGlobe.registerMouseEvent('RIGHT_CLICK', function(e) {});

Step 3.?設(shè)置場(chǎng)景投影參數(shù)：
????給場(chǎng)景投影對(duì)象設(shè)置進(jìn)行場(chǎng)景投影使用的必要參數(shù)。

• Example:

  //設(shè)置投影觀察點(diǎn)scenePro.viewPosition = cartesian;//數(shù)據(jù)url路徑scenePro.textureSource = './static/data/picture/world.jpg';//設(shè)置場(chǎng)景投影結(jié)果點(diǎn)scenePro.targetPosition = cartesian;

模型壓平

????模型壓平，即將加載完成的M3D數(shù)據(jù)進(jìn)行壓平處理。一般可通過交互式方式實(shí)現(xiàn)模型壓平功能。

????具體實(shí)現(xiàn)：添加交互式繪制工具?Cesium.DrawPolygonTool()?選擇繪制區(qū)域, 初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createModelFlatten()?方法，創(chuàng)建模型壓平分析，將結(jié)果顯示到三維球控件上。

Step 1.?創(chuàng)建交互式繪制區(qū)工具：
????初始化?Cesium.DrawPolygonTool()?對(duì)象，完成交互式繪制區(qū)工具的創(chuàng)建；

• Example:

  //創(chuàng)建交互式繪制區(qū)工具var drawPolygon = new Cesium.DrawPolygonTool(webGlobe.viewer, getDrawResult);

Step 2.?激活交互式繪制區(qū)工具：
????調(diào)用?Cesium.DrawPolygonTool()?對(duì)象的activeTool()方法，激活交互式繪制區(qū)工具，完成此步后，可在三維場(chǎng)景中通過鼠標(biāo)左鍵點(diǎn)擊繪制多邊形。

• Example:

  //激活交互式繪制區(qū)工具drawPolygon.activeTool();

Step 3.?頂點(diǎn)處理：
????將交互式選取的點(diǎn)處理；

• Example:

  /*對(duì)繪制區(qū)域的頂點(diǎn)循環(huán)處理一下，以便用于模型壓平參數(shù)的賦值*/var array = [];for (let i = 0; i < positionsArray.length; i++) { ? ?let point = positionsArray[i]; ? ?let resPoint = new Cesium.Cartesian3; ? ?let invserTran = new Cesium.Matrix4; ? ?Cesium.Matrix4.inverse(tileset[0]._root.transform, invserTran); ? ?Cesium.Matrix4.multiplyByPoint(invserTran, point, resPoint); ? ?resPoint.y = -resPoint.y; ? ?array.push(new Cesium.Cartesian2(resPoint.x, resPoint.y));}array.push(array[0]);

Step 4.?創(chuàng)建模型壓平分析：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createModelFlatten()?方法，創(chuàng)建模型壓平分析

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: webGlobe.viewer});advancedAnalysisManager.createModelFlatten(landscapeLayer[0], { ? ?//是否進(jìn)行壓平。值為true時(shí)執(zhí)行壓平 ? ?isFlatten: true, ? ?//將高度壓到0 ? ?height: 0, ? ?//壓平多邊形的頂點(diǎn)序列長(zhǎng)度 ? ?arrayLength: positionsArray.length, ? ?//頂點(diǎn)序列。頂點(diǎn)序列需要閉合，也就是說，例如一個(gè)矩形是四個(gè)頂點(diǎn)ABCD，那序列就應(yīng)該是【ABCDA】 ? ?array: array});

Step 5.?結(jié)果顯示：
????將結(jié)果顯示到三維球控件上。

• Example:

  //場(chǎng)景渲染（渲染最新的壓平效果）webGlobe.viewer.scene.requestRender();

坡向分析

????此功能用于地形數(shù)據(jù)的坡向分析。 坡向是指地表面上一點(diǎn)的切平面的法線在水平面的投影與該點(diǎn)的正北方向的夾角，描述該點(diǎn)高程值改變量的最大變化方向。坡向分析作用是：決定地表面局部地面接收陽(yáng)光和重新分配太陽(yáng)輻射量的重要地形因子，直接造成局部地區(qū)氣候特征差異，影響各項(xiàng)農(nóng)業(yè)生產(chǎn)指標(biāo)。

????具體實(shí)現(xiàn)：初始化地形圖層管理類?CesiumZondy.Layer.TerrainLayer?并調(diào)用?append()?方法加載地形數(shù)據(jù)后，跳轉(zhuǎn)視點(diǎn)，創(chuàng)建高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?，調(diào)用?createAspectAnalysis()?方法進(jìn)行坡向分析。

Step 1.?加載數(shù)據(jù)：
????初始化地形圖層管理類?CesiumZondy.Layer.TerrainLayer?并調(diào)用?append()?方法傳入三維地形數(shù)據(jù)地圖服務(wù)地址，即可加載瀏覽數(shù)據(jù)；

• Example:

  //構(gòu)造地形圖層管理類var terrain = new CesiumZondy.Layer.TerrainLayer({ ? ?viewer: webGlobe.viewer});//加載三維地形地圖文檔（服務(wù)地址，配置參數(shù)）var { protocol, ip, port } = window.webclient;var terrainlayer = terrain.append(`http://develop.smaryun.com:6163/igs/rest/g3d/terrain`, {});//初始化視圖功能管理類var sceneManager = new CesiumZondy.Manager.SceneManager({ ? ?viewer: webGlobe.viewer});

Step 2.?坡向分析：
????創(chuàng)建高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?，調(diào)用?createAspectAnalysis()?方法進(jìn)行坡向分析。

• Example:

  //初始化高級(jí)分析功能管理類 ?var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ? ?viewer: webGlobe.viewer ?}); ?webGlobe.viewer.scene.globe.depthTestAgainstTerrain = true; ?//進(jìn)行坡向分析 ?var aspectAna = advancedAnalysisManager.createAspectAnalysis([ ? ? ?Cesium.Color.ALICEBLUE, ? ? ?Cesium.Color.ANTIQUEWHITE, ? ? ?Cesium.Color.AQUA, ? ? ?Cesium.Color.AQUAMARINE, ? ? ?Cesium.Color.AZURE, ? ? ?Cesium.Color.BEIGE ?]);

坡度分析

????此功能用于地形數(shù)據(jù)的坡度分析。 坡度是指過地表一點(diǎn)的切平面與水平面的夾角，描述地表面在該點(diǎn)的傾斜程度。坡度分析的作用是：影響地表物質(zhì)流動(dòng)與能量轉(zhuǎn)換的規(guī)模與強(qiáng)度，制約生產(chǎn)力空間布局。

????具體實(shí)現(xiàn)：初始化地形圖層管理類?CesiumZondy.Layer.TerrainLayer?并調(diào)用?append()?方法加載地形數(shù)據(jù)后，跳轉(zhuǎn)視點(diǎn)，創(chuàng)建高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?，調(diào)用?createSlopeAnalysis()?方法進(jìn)行坡度分析。

Step 1.?加載數(shù)據(jù)：
????初始化地形圖層管理類?CesiumZondy.Layer.TerrainLayer?并調(diào)用?append()?方法傳入三維地形數(shù)據(jù)地圖服務(wù)地址，即可加載瀏覽數(shù)據(jù)；

• Example:

  //構(gòu)造地形圖層管理類var terrain = new CesiumZondy.Layer.TerrainLayer({ ? ?viewer: webGlobe.viewer});//加載三維地形地圖文檔（服務(wù)地址，配置參數(shù)）var { protocol, ip, port } = window.webclient;var terrainlayer = terrain.append(`http://develop.smaryun.com:6163/igs/rest/g3d/terrain`, {});//初始化視圖功能管理類var sceneManager = new CesiumZondy.Manager.SceneManager({ ? ?viewer: webGlobe.viewer});

Step 2.?坡度分析：
????創(chuàng)建高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?，調(diào)用?createSlopeAnalysis()?方法進(jìn)行坡度分析。

• Example:

  //初始化高級(jí)分析功能管理類 ?var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ? ?viewer: webGlobe.viewer ?}); ?webGlobe.viewer.scene.globe.depthTestAgainstTerrain = true; ?//進(jìn)行坡度分析 ?var slopeAna = advancedAnalysisManager.createSlopeAnalysis([ ? ? ?Cesium.Color.ALICEBLUE, ? ? ?Cesium.Color.ANTIQUEWHITE, ? ? ?Cesium.Color.AQUA, ? ? ?Cesium.Color.AQUAMARINE, ? ? ?Cesium.Color.AZURE, ? ? ?Cesium.Color.BEIGE ?]);

填挖方計(jì)算

????此功能提供用于計(jì)算將一定范圍內(nèi)的地形填平到某一高度時(shí)，需要挖開或填充的空間體積，可以應(yīng)用于智慧城市，地質(zhì)，公安等多個(gè)領(lǐng)域的業(yè)務(wù)功能，實(shí)用性強(qiáng)。

????具體實(shí)現(xiàn)：初始化?Cesium.DrawElement()?對(duì)象在三維場(chǎng)景中添加交互式繪制區(qū)控件用來界定量算區(qū)域，初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager()?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createCutFill()?方法創(chuàng)建填挖方分析對(duì)象, 調(diào)用高級(jí)分析功能管理類的?startCutFill()?方法執(zhí)行填挖方分析。

Step 1.?創(chuàng)建交互式繪制工具：
????初始化?Cesium.DrawElement()?對(duì)象，完成交互式繪制工具的創(chuàng)建；

• Example:

  //創(chuàng)建交互式繪制工具var drawElement = new Cesium.DrawElement(webGlobe.viewer);

Step 2.?激活交互式繪制區(qū)工具：
????調(diào)用?Cesium.DrawElement()?對(duì)象的startDrawingPolygon()方法，激活交互式繪制區(qū)工具，完成此步后，可在三維場(chǎng)景中通過鼠標(biāo)左鍵點(diǎn)擊繪制多邊形；

• Example:

  //激活交互式繪制區(qū)工具drawElement.startDrawingPolygon();

Step 3.?創(chuàng)建填挖方分析：
????初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager（）?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createCutFill()?方法創(chuàng)建填挖方分析對(duì)象；

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: viewer});//創(chuàng)建填挖方實(shí)例cutFill = advancedAnalysisManager.createCutFill(0.0, { ? ?//設(shè)置x方向采樣點(diǎn)個(gè)數(shù) ? ?xPaneNum: document.getElementById("x").value <= 0 ? 16 : document.getElementById("x").value, ? ?//設(shè)置y方向采樣點(diǎn)個(gè)數(shù)參數(shù) ? ?yPaneNum: document.getElementById("y").value <= 0 ? 16 : document.getElementById("y").value, ? ?//設(shè)置填挖規(guī)整高度 ? ?Height: document.getElementById("z").value <= 0 ? 16 : document.getElementById("z").value, ? ?//返回結(jié)果的回調(diào)函數(shù) ? ?callback: function(result) { ? ? ? ?document.getElementById("height").value = result.minHeight.toFixed(2) + '~' + result.maxHeight.toFixed(2); ? ? ? ?document.getElementById("surfaceArea").value = result.surfaceArea; ? ? ? ?document.getElementById("cutVolume").value = result.cutVolume; ? ? ? ?document.getElementById("fillVolume").value = result.fillVolume; ? ?}});

Step 4.?執(zhí)行填挖方分析：
????調(diào)用高級(jí)分析功能管理類的?startCutFill()?方法執(zhí)行填挖方分析。

• Example:

  //開始執(zhí)行填挖方分析advancedAnalysisManager.startCutFill(cutFill, positions);

動(dòng)畫漫游

????此功能用于在三維場(chǎng)景中實(shí)現(xiàn)動(dòng)畫漫游功能，即讓模型沿著路徑漫游，默認(rèn)為第一人稱漫游，可修改動(dòng)畫漫游方式。本示例實(shí)現(xiàn)讓飛機(jī)模型按既定的路徑漫游。在實(shí)際應(yīng)用中，可結(jié)合具體應(yīng)用場(chǎng)景開發(fā)，如繪制路徑進(jìn)行動(dòng)畫漫游等功能需求等。

????具體實(shí)現(xiàn)：初始化高級(jí)分析功能管理類?CesiumZondy.Manager.AdvancedAnalysisManager?對(duì)象，調(diào)用高級(jí)分析功能管理類的?createAnimation()?方法創(chuàng)建動(dòng)畫漫游對(duì)象實(shí)例實(shí)現(xiàn)動(dòng)畫漫游功能。

Step 1.?創(chuàng)建動(dòng)畫漫游對(duì)象：
????初始化高級(jí)分析功能管理類對(duì)象CesiumZondy.Manager.AdvancedAnalysisManager，調(diào)用createAnimation()方法創(chuàng)建動(dòng)畫漫游對(duì)象；

• Example:

  ? //初始化高級(jí)分析功能管理類 ? ?var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ? ? ? viewer: webGlobe.viewer ? ?}); ? ?//創(chuàng)建動(dòng)畫漫游對(duì)象 ? ?animation = advancedAnalysisManager.createAnimation({ ? ? ? ?exHeight: 9, ? ? ? ?isLoop: false, ? ? ? ?//漫游模型url ? ? ? ?modelUrl: './static/data/model/WuRenJi.glb', ? ? ? ?//完成動(dòng)畫漫游回調(diào)函數(shù) ? ? ? ?complete: function () { ? ? ? ? ? ?alert('完畢'); ? ? ? ?} ? ?});

Step 2.?實(shí)現(xiàn)動(dòng)畫漫游控制：
????通過動(dòng)畫漫游對(duì)象的屬性和方法實(shí)現(xiàn)動(dòng)畫漫游控制，即通過屬性設(shè)置漫游路徑、漫游方式、速度、俯仰角、方位角等參數(shù)，分別通過調(diào)用方法start()、stop()開始和結(jié)束漫游。

• Example:

  ? //漫游路徑 ? ?positions = Cesium.Cartesian3.fromDegreesArray([ ? ? ? ? ? ? ? ?117.213063, 31.812956, 117.213162, 31.812389, 117.212929, 31.812056, 117.213275, 31.811582, ? ? ? ? ? ? ? ?117.21348, 31.811513, 117.214141, 31.811682, 117.21497, 31.811691, 117.216318, 31.811454, ? ? ? ? ? ? ? ?117.216962, 31.812037, 117.217893, 31.812298, 117.218607, 31.811488, 117.219466, 31.810935, ? ? ? ? ? ? ? ?117.224439, 31.810929, 117.225266, 31.811119, 117.225308, 31.81131, 117.224819, 31.811724, ? ? ? ? ? ? ? ?117.225189, 31.811928, 117.225676, 31.811624, 117.225843, 31.811943, 117.22625, 31.812183, ? ? ? ? ? ? ? ?117.226292, 31.81281, 117.225888, 31.813287, 117.226093, 31.814059, 117.22564, 31.814582, ? ? ? ? ? ? ? ?117.225953, 31.814731, 117.225611, 31.814954, 117.22576, 31.815233, 117.224073, 31.816329, ? ? ? ? ? ? ? ?117.223694, 31.81627, 117.222769, 31.817007, 117.222259, 31.816871, 117.221922, 31.816707, ? ? ? ? ? ? ? ?117.221653, 31.816788, 117.22151, 31.817002, 117.221039, 31.816891, 117.220395, 31.816352, ? ? ? ? ? ? ? ?117.220166, 31.815734, 117.219804, 31.815607, 117.219461, 31.815122, 117.21878, 31.814846, ? ? ? ? ? ? ? ?117.218297, 31.815275, 117.217975, 31.815172, 117.217142, 31.815229, 117.216753, 31.815124, ? ? ? ? ? ? ? ?117.216652, 31.814308, 117.215726, 31.814049, 117.214769, 31.813517, 117.214111, 31.813717, ? ? ? ? ? ? ? ?117.213552, 31.814099, 117.213024, 31.813954, 117.212897, 31.813892, 117.213224, 31.813681, ? ? ? ? ? ? ? ?117.212788, 31.813147, 117.212928, 31.813018, 117.213063, 31.812956 ? ?]); ? ?//設(shè)置路徑 ? ?animation.positions = positions; ? ?//漫游方式：1-跟隨、2-鎖定第一視角、3-上帝視角 ? ?animation.animationType = 2; ? ?//漫游速度 ? ?animation.speed = 1;

• Example:

  ? function start() { ? ? ? ?//開始漫游 ? ? ? ?animation.start(); ? ?} ? ?function pause() { ? ? ? ?//暫停漫游 ? ? ? ?animation.pause = true; ? ?} ? ?function stop() { ? ? ? ?//停止漫游 ? ? ? ?animation.stop(); ? ?}

場(chǎng)景特效

????支持常用粒子特效，如雨、雪、霧、火焰、煙霧等，模擬自然天氣或動(dòng)態(tài)場(chǎng)景。

類名/方法名API說明CesiumZondy.Manager.AdvancedAnalysisManager / createRain()降雨粒子特效CesiumZondy.Manager.AdvancedAnalysisManager / createSnow()降雪粒子特效CesiumZondy.Manager.AdvancedAnalysisManager / createFog()霧粒子特效CesiumZondy.Manager.AdvancedAnalysisManager / createFire()火焰粒子特效CesiumZondy.Manager.AdvancedAnalysisManager / createStableParticle()自定義粒子特效

降雨特效

????具體實(shí)現(xiàn)：首先構(gòu)造CesiumZondy.Manager.AdvancedAnalysisManager高級(jí)分析功能類對(duì)象，然后調(diào)用createRain()方法添加降雨粒子特效，可通過可選參數(shù)實(shí)現(xiàn)降雨效果的調(diào)整。

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ viewer: webGlobe.viewer });//添加下雨特效advancedAnalysisManager.createRain({ ? ?//色調(diào)調(diào)整 ? ?hueShift: 0.7});

降雪特效

????具體實(shí)現(xiàn)：首先構(gòu)造CesiumZondy.Manager.AdvancedAnalysisManager高級(jí)分析功能類對(duì)象，然后調(diào)用createSnow()方法添加降雪粒子特效，可通過可選參數(shù)實(shí)現(xiàn)降雪效果的調(diào)整。

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ viewer: webGlobe.viewer });//添加下雪特效advancedAnalysisManager.createSnow({ ? ?//色調(diào) ? ?hueShift: 0.7});

霧特效

????具體實(shí)現(xiàn)：首先構(gòu)造CesiumZondy.Manager.AdvancedAnalysisManager高級(jí)分析功能類對(duì)象，然后調(diào)用createFog()方法添加霧粒子特效，可通過可選參數(shù)實(shí)現(xiàn)霧效的調(diào)整。

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ viewer: webGlobe.viewer });//添加霧效advancedAnalysisManager.createFog({ ? ?//霧特效透明度 ? ?alpha:0.5});

火焰特效

????具體實(shí)現(xiàn)：首先構(gòu)造CesiumZondy.Manager.AdvancedAnalysisManager高級(jí)分析功能類對(duì)象，然后調(diào)用createFire()方法添加火焰粒子特效，可通過可選參數(shù)實(shí)現(xiàn)火焰特效的調(diào)整。

• Example:

  //初始化高級(jí)分析功能管理類var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ viewer: webGlobe.viewer })//位置點(diǎn)let position = [114.40103, 30.4679, 12]//火焰圖片urllet imageUrl = './static/data/effect/fire.png'//添加火焰粒子特效fireObj = advancedAnalysisManager.createFire(imageUrl, position)

• Example:

  ? if (name === 'emissionRate') { ? ? ? ? ? ?//排放率 ? ? ? ? ? ?fireObj.emissionRate = parseFloat(newValue); ? ?} ? ?if (name === 'particleSize') { ? ? ? ?var particleSize = parseFloat(newValue); ? ? ? ?//圖像尺寸 ? ? ? ?fireObj.imageSize = new Cesium.Cartesian2(particleSize, particleSize); ? ?} ? ?if (name === 'particleLife') { ? ? ? ?//粒子生命 ? ? ? ?fireObj.particleLife = parseFloat(newValue); ? ?} ? ?if (name === 'speed') { ? ? ? ?//速度 ? ? ? ?fireObj.speed = parseFloat(newValue); ? ?} ? ?if (name === 'startScale') { ? ? ? ?//起始規(guī)模 ? ? ? ?fireObj.startScale = parseFloat(newValue); ? ?} ? ?if (name === 'endScale') { ? ? ? ?//終止規(guī)模 ? ? ? ?fireObj.endScale = parseFloat(newValue); ? ?}

自定義粒子特效（煙霧）

????煙霧粒子特效，與火焰粒子特效相同，可以模擬火災(zāi)等各類火焰煙霧、水汽煙霧相關(guān)的場(chǎng)景。可通過自定義粒子特效接口實(shí)現(xiàn)煙霧粒子特效。

????具體實(shí)現(xiàn)：首先構(gòu)造CesiumZondy.Manager.AdvancedAnalysisManager高級(jí)分析功能類對(duì)象，然后調(diào)用createStableParticle()方法分別添加火焰與煙霧粒子特效，可通過可選參數(shù)實(shí)現(xiàn)煙霧特效的調(diào)整。

• Example:

  ? //初始化高級(jí)分析功能管理類 ? ?var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ? ? ?viewer: webGlobe.viewer ? ?}); ? ?//粒子發(fā)射位置點(diǎn) ? ?let position = [114.40103, 30.4679, 12]; ? ?//火焰與煙霧圖片url ? ?let imageUrl1 = './static/data/effect/fire1.png'; ? ?let imageUrl2 = './static/data/effect/smoke1.png'; ? ?//添加煙霧粒子特效 ? ?fireObj = advancedAnalysisManager.createStableParticle(imageUrl1, position, { ? ? ? ?emissionRate: 3, ? ? ? ?startScale: 1, ? ? ? ?endScale: 3 ? ?}); ? ?//添加煙霧粒子特效 ? ?smokeObj = advancedAnalysisManager.createStableParticle(imageUrl2, position, { ? ? ? ?emissionRate: 35, ? ? ? ?startScale: 5, ? ? ? ?endScale: 8 ? ?});

• Example:

  if (name === 'emissionRate') { ? ?//排放率 ? ?smokeObj.emissionRate = parseFloat(newValue);}if (name === 'particleSize') { ? ?var particleSize = parseFloat(newValue); ? ?//圖像尺寸 ? ?smokeObj.imageSize = new Cesium.Cartesian2(particleSize, particleSize);}if (name === 'particleLife') { ? ?smokeObj.particleLife = parseFloat(newValue);}if (name === 'speed') { ? ?smokeObj.speed = parseFloat(newValue);}if (name === 'startScale') { ? ?//起始規(guī)模 ? ?smokeObj.startScale = parseFloat(newValue);}if (name === 'endScale') { ? ?//終止規(guī)模 ? ?smokeObj.endScale = parseFloat(newValue);}

軌跡模擬

模型漫游

????模型漫游，此功能用于在三維場(chǎng)景中添加模型動(dòng)態(tài)運(yùn)動(dòng)顯示效果。

????具體實(shí)現(xiàn)：創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?cruiseModel()?方法創(chuàng)建模型漫游，通過?startCruiseModel()?方法開始模型漫游，通過?stopCruiseModel()?方法暫停模型漫游, 通過?clearCruiseModel()?方法清除模型漫游。

Step 1.?創(chuàng)建模型漫游:
????創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?cruiseModel()?方法創(chuàng)建模型漫游；

• Example:

  //初始化分析功能管理類var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ?viewer: webGlobe.viewer});//模型漫游var modelEntity = analysisManager.cruiseModel( ?//模型URL地址 './static/data/model/GroundVehicle.glb', ?//漫游點(diǎn)集 ?positionArr, ?//是否顯示漫游路徑 ?true, ?//漫游時(shí)鐘頻率 ?10);

Step 2.?開始模型漫游:
????創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用?startCruiseModel()?方法開始模型漫游。

• Example:

  /*開始漫游*/analysisManager.startCruiseModel();

動(dòng)態(tài)航線

????動(dòng)態(tài)航線，此功能用于動(dòng)態(tài)顯示兩點(diǎn)之間的動(dòng)態(tài)飛行軌跡效果。

????具體實(shí)現(xiàn)：初始化?CesiumZondy.Manager.AdvancedAnalysisManager()高級(jí)分析功能管理對(duì)象，然后調(diào)用?createDynamicPolyline()?方法創(chuàng)建動(dòng)態(tài)航線。

• Example:

  //開啟動(dòng)畫webGlobe.viewer.clock.shouldAnimate = true;//構(gòu)造高級(jí)分析功能管理對(duì)象var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ ? ?viewer: webGlobe.viewer});//創(chuàng)建動(dòng)態(tài)航線var dynamicLine = advancedAnalysisManager.createDynamicPolyline( ? ?//航線起始城市經(jīng)緯度 ? ?{ ? ? ? ?lon: 114.302312702, ? ? ? ?lat: 30.598026044 ? ?}, ? ?//航線終點(diǎn)城市數(shù)組，經(jīng)緯度 ? ?[ ? ? ? ?{ "lon": 115.028495718, "lat": 30.200814617 }, ? ? ? ?{ "lon": 110.795000473, "lat": 32.638540762 }, ? ? ? ?{ "lon": 111.267729446, "lat": 30.698151246 }, ? ? ? ?{ "lon": 112.126643144, "lat": 32.058588576 }, ? ? ? ?{ "lon": 114.885884938, "lat": 30.395401912 }, ? ? ? ?{ "lon": 112.190419415, "lat": 31.043949588 }, ? ? ? ?{ "lon": 113.903569642, "lat": 30.932054050 }, ? ? ? ?{ "lon": 112.226648859, "lat": 30.367904255 }, ? ? ? ?{ "lon": 114.861716770, "lat": 30.468634833 }, ? ? ? ?{ "lon": 114.317846048, "lat": 29.848946148 }, ? ? ? ?{ "lon": 113.371985426, "lat": 31.704988330 }, ? ? ? ?{ "lon": 109.468884533, "lat": 30.289012191 }, ? ? ? ?{ "lon": 113.414585069, "lat": 30.368350431 }, ? ? ? ?{ "lon": 112.892742589, "lat": 30.409306203 }, ? ? ? ?{ "lon": 113.160853710, "lat": 30.667483468 }, ? ? ? ?{ "lon": 110.670643354, "lat": 31.748540780 } ? ?], ? ?{ ? ? ? ?//是否已經(jīng)添加動(dòng)態(tài)航線 ? ? ? ?isAdd: false, ? ? ? ?//航線顏色：默認(rèn)紅色 ? ? ? ?color: new Cesium.Color(255 / 255, 0 / 255, 0 / 255, 1) ? ?});

客戶端可視化

熱力圖

????熱力圖，此功能用于在當(dāng)前三維場(chǎng)景中添加熱力圖顯示效果。

????具體實(shí)現(xiàn)：創(chuàng)建分析功能管理類?CesiumZondy.Manager.AnalysisManager()?，調(diào)用關(guān)鍵接口?createHeatMap()?添加熱力圖。

• Example:

  var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ?viewer: webGlobe.viewer})//創(chuàng)建熱力圖（范圍、最大值、最小值）var instance = analysisManager.createHeatMap(bounds, valueMin, valueMax, data, options);

動(dòng)態(tài)圓

????動(dòng)態(tài)圓，此功能用于在當(dāng)前場(chǎng)景中繪制動(dòng)態(tài)的圓顯示效果，可應(yīng)用于任意場(chǎng)景中。

????具體實(shí)現(xiàn)：先初始化?Cesium.CircleScanEffect()?動(dòng)態(tài)圓對(duì)象，然后通過分析功能管理類CesiumZondy.Manager.AnalysisManager?的addSceneEffect()方法添加動(dòng)態(tài)圓顯示；removeSceneEffect()方法移除動(dòng)態(tài)圓顯示。

Step 1.?創(chuàng)建動(dòng)態(tài)圓：
????初始化動(dòng)態(tài)圓對(duì)象?Cesium.CircleScanEffect()，注意使用動(dòng)態(tài)圓功能必須開啟深度檢測(cè)?；

• Example:

  //開啟地形深度檢測(cè)（必須）webGlobe.viewer.scene.globe.depthTestAgainstTerrain = true;//初始化動(dòng)態(tài)圓對(duì)象var scanEffect = new Cesium.CircleScanEffect(webGlobe.viewer, { ? ?center: Cesium.Cartesian3.fromDegrees(114.06, 22.54, 20), ? ?maxRadius: 5000, ? ?scanColor: new Cesium.Color(1, 0, 0, 1), ? ?duration: 8000});

Step 2.?添加/移除動(dòng)態(tài)圓：
????調(diào)用Cesium三維球分析功能管理類CesiumZondy.Manager.AnalysisManager?的addSceneEffect()方法添加動(dòng)態(tài)圓顯示，相應(yīng)可調(diào)用removeSceneEffect()方法移除。

• Example:

  //初始化分析功能管理類var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ?viewer: webGlobe.viewer});//添加添加場(chǎng)景特效-動(dòng)態(tài)圓analysisManager.addSceneEffect(scanEffect);//通過removeSceneEffect()移除場(chǎng)景特效//analysisManager.removeSceneEffect(scanEffect);

雷達(dá)掃描圓

????雷達(dá)掃描圓，此功能用于在當(dāng)前場(chǎng)景中添加雷達(dá)掃描圓顯示效果，可應(yīng)用于任意場(chǎng)景中。

????具體實(shí)現(xiàn)：初始化高級(jí)分析管理類?CesiumZondy.Manager.AdvancedAnalysisManager?的createRadarScan()方法創(chuàng)建雷達(dá)掃描圓對(duì)象，然后分別通過分析功能管理類CesiumZondy.Manager.AnalysisManager?的addSceneEffect()方法與removeSceneEffect()方法來添加與移除雷達(dá)掃描圓顯示功能。

Step 1.?創(chuàng)建雷達(dá)掃描圓：
????初始化高級(jí)分析功能管理類對(duì)象?CesiumZondy.Manager.AdvancedAnalysisManager?，調(diào)用createRadarScan()方法創(chuàng)建雷達(dá)掃描圓對(duì)象，注意必須開啟深度檢測(cè)?；

• Example:

  //開啟深度檢測(cè)（必須） webGlobe.viewer.scene.globe.depthTestAgainstTerrain = true; ?//初始化高級(jí)分析功能管理類 ?var advancedAnalysisManager = new CesiumZondy.Manager.AdvancedAnalysisManager({ viewer: webGlobe.viewer }); ?//創(chuàng)建一個(gè)雷達(dá)掃描圓對(duì)象 ?var radarScanEffect = advancedAnalysisManager.createRadarScan( ? ? ?//雷達(dá)中心點(diǎn) ? ? ?Cesium.Cartesian3.fromDegrees(120.9558, 23.4481, 3657), ? ? ?//掃描半徑 ? ? ? 5000, ? ? ?//掃描區(qū)域顏色 ? ? ?new Cesium.Color(255 / 255, 0 / 255, 0 / 255, 1), ? ? ?//周期時(shí)間,單位毫秒 ? ? ?8000 ?);

Step 2.?添加/移除雷達(dá)掃描圓顯示：
????調(diào)用分析功能管理類CesiumZondy.Manager.AnalysisManager?的addSceneEffect()方法添加雷達(dá)掃描圓顯示，相應(yīng)可調(diào)用removeSceneEffect()方法移除。

• Example:

  //初始化分析功能管理類var analysisManager = new CesiumZondy.Manager.AnalysisManager({ ? ?viewer: webGlobe.viewer});//添加場(chǎng)景特效-雷達(dá)掃描圓analysisManager.addSceneEffect(radarScanEffect);//移除場(chǎng)景特效-雷達(dá)掃描圓//analysisManager.removeSceneEffect(radarScanEffect);

客戶端可視化-Echarts

????在三維場(chǎng)景中接入百度ECharts，支持三維場(chǎng)景中加載ECharts散點(diǎn)圖、熱力圖、路徑圖、漸近線、自定義網(wǎng)格專題圖等。

百度 ECharts：ECharts完整、詳細(xì)使用方法可參考官方教程API，開發(fā)庫(kù)下載可參考官方下載

對(duì)接Echarts特別說明：MapGIS Client for JavaScript在Cesium中對(duì)接了百度Echarts圖表插件，若插件本身存在問題，請(qǐng)優(yōu)先參考Echarts官網(wǎng)解決方案

????**以散點(diǎn)圖-空氣質(zhì)量為例：實(shí)現(xiàn)在三維場(chǎng)景中加載ECharts散點(diǎn)圖，基于全國(guó)主要城市空氣質(zhì)量數(shù)據(jù)實(shí)現(xiàn)散點(diǎn)圖的可視化。**通過關(guān)鍵接口CesiumZondy.Overlayer.EchartsLayer()來實(shí)現(xiàn)ECharts圖層的加載。

Step 1.?數(shù)據(jù)準(zhǔn)備：
????準(zhǔn)備全國(guó)主要城市的數(shù)據(jù)，包括名稱、坐標(biāo)點(diǎn)、空氣質(zhì)量，并按照格式要求進(jìn)行處理；

• Example:

  function initData() { ? ?data = [ ? ? ? ?{name: '海門',value: 9}, ? ? ? ?{name: '鄂爾多斯',value: 12}, ? ? ? ?{name: '招遠(yuǎn)',value: 12}, ? ? ? ?{name: '舟山',value: 12}, ? ? ? ?··· ? ?]; ? ?geoCoordMap = { ? ? ? ?'海門': [121.15, 31.89], ? ? ? ?'鄂爾多斯': [109.781327, 39.608266], ? ? ? ?'招遠(yuǎn)': [120.38, 37.35], ? ? ? ?'舟山': [122.207216, 29.985295], ? ? ? ?··· ? ?};}function convertData(data) { ? ?var res = []; ? ?for (var i = 0; i < data.length; i++) { ? ? ? ?var geoCoord = geoCoordMap[data[i].name]; ? ? ? ?if (geoCoord) { ? ? ? ? ? ?res.push({ ? ? ? ? ? ? ? ? name: data[i].name, ? ? ? ? ? ? ? ?value: geoCoord.concat(data[i].value) ? ? ? ? ? ?}); ? ? ? ?} ? ?} ? ?return res;};

Step 2.?配置參數(shù)項(xiàng)：
????創(chuàng)建各種需要的組件，如標(biāo)題、圖例、提示框等，其中最關(guān)鍵的是“series-系列”組件，構(gòu)造完成后，即可調(diào)用CesiumZondy.Overlayer.EchartsLayer(map, option).addTo(map)方法，將ECharts圖層添加到三維場(chǎng)景中。

• Example:

  function initEcharts() { ? ?option = { ? ? ? ?title: { ? ? ? ? ? ?text: '全國(guó)主要城市空氣質(zhì)量 - 百度地圖提供數(shù)據(jù)', ? ? ? ? ? ?textStyle: { ? ? ? ? ? ? ? ?color: '#eee' ? ? ? ? ? ?}, ? ? ? ? ? ?subtext: 'data from PM25.in', ? ? ? ? ? ?sublink: 'http://www.pm25.in', ? ? ? ? ? ?left: 'center' ? ? ? ?}, ? ? ? ?legend: { ? ? ? ? ? ?orient: 'vertical', ? ? ? ? ? ?y: 'top', ? ? ? ? ? ?x: 'left', ? ? ? ? ? ?data: ['pm2.5'], ? ? ? ? ? ?textStyle: { ? ? ? ? ? ? ? ?color: '#fff' ? ? ? ? ? ?} ? ? ? ?}, ? ? ? ? tooltip: { ? ? ? ? ? ?trigger: 'item' ? ? ? ?}, ? ? ? ?cesium: { ? ? ? ? ? ? roam: true ? ? ? ?}, ? ? ? ?series: [{ ? ? ? ? ? ? ? ?name: 'pm2.5', ? ? ? ? ? ? ? ?type: 'scatter', ? ? ? ? ? ? ? ?coordinateSystem: 'cesium', ? ? ? ? ? ? ? ?data: convertData(data), ? ? ? ? ? ? ? symbolSize: function (val) { ? ? ? ? ? ? ? ? ? ?return val[2] / 10; ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?showEffectOn: 'render', ? ? ? ? ? ? ? ?rippleEffect: { ? ? ? ? ? ? ? ? ? ?brushType: 'stroke' ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?hoverAnimation: true, ? ? ? ? ? ? ? ?label: { ? ? ? ? ? ? ? ? ? ?normal: { ? ? ? ? ? ? ? ? ? ? ? ?formatter: '', ? ? ? ? ? ? ? ? ? ? ? ?position: 'right', ? ? ? ? ? ? ? ? ? ? ? ?show: false ? ? ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ? ? ?emphasis: { ? ? ? ? ? ? ? ? ? ? ? ?show: true ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?itemStyle: { ? ? ? ? ? ? ? ? ? ?normal: { ? ? ? ? ? ? ? ? ? ? ? color: '#ddb926' ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?zlevel: 1 ? ? ? ? ? ?}, ? ? ? ? ? ?{ ? ? ? ? ? ? ? ?name: 'Top 5', ? ? ? ? ? ? ? ?type: 'effectScatter', ? ? ? ? ? ? ? ?coordinateSystem: 'cesium', ? ? ? ? ? ? ? ?data: convertData(data.sort(function (a, b) { ? ? ? ? ? ? ? ? ? ?return b.value - a.value; ? ? ? ? ? ? ? ?}).slice(0, 6)), ? ? ? ? ? ? ? symbolSize: function (val) { ? ? ? ? ? ? ? ? ? ?return val[2] / 10; ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?showEffectOn: 'render', ? ? ? ? ? ? ? ?rippleEffect: { ? ? ? ? ? ? ? ? ? ?brushType: 'stroke' ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?hoverAnimation: true, ? ? ? ? ? ? ? ?label: { ? ? ? ? ? ? ? ? ? ?normal: { ? ? ? ? ? ? ? ? ? ? ? ?formatter: '', ? ? ? ? ? ? ? ? ? ? ? ?position: 'right', ? ? ? ? ? ? ? ? ? ? ? ?show: true ? ? ? ? ? ? ? ? ? ?} ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?itemStyle: { ? ? ? ? ? ? ? ? ? ?normal: { ? ? ? ? ? ? ? ? ? ? ? ?color: '#f4e925', ? ? ? ? ? ? ? ? ? ? ? ?shadowBlur: 10, ? ? ? ? ? ? ? ? ? ? ? ?shadowColor: '#333' ? ? ? ? ? ? ? ? ? ? } ? ? ? ? ? ? ? ?}, ? ? ? ? ? ? ? ?zlevel: 1 ? ? ? ? ? ?} ? ? ? ?] ? ?} ? ?layer = new CesiumZondy.Overlayer.EchartsLayer(map, option).addTo(map);}

客戶端可視化-MapV

????在三維場(chǎng)景中接入MapV，支持三維場(chǎng)景中加載MapV熱力圖、等。

對(duì)接Mapv特別說明：MapGIS Client for JavaScript在Cesium中對(duì)接了MapV插件，若插件本身存在問題，請(qǐng)優(yōu)先參考Mapv官方教程尋找解決方案

????以MapV熱力圖為例：實(shí)現(xiàn)在三維場(chǎng)景中加載MapV熱力圖，熱力圖采用特殊高亮的形式顯示訪客熱衷的頁(yè)面區(qū)域和訪客所在的地理區(qū)域。通過關(guān)鍵接口?CesiumZondy.Overlayer.MapvLayer()?來實(shí)現(xiàn)MapV圖層的加載。

Step 1.?創(chuàng)建?DataSet?對(duì)象：
????首先構(gòu)造DataSet對(duì)象需要的數(shù)據(jù)，然后使用數(shù)據(jù)創(chuàng)建DataSet對(duì)象。DataSet對(duì)象使用Mapv框架的原生API創(chuàng)建，更多詳細(xì)信息參考Mapv官方教程；

• Example:

  var randomCount = 1000;var data = [];var citys = ["北京", "天津", "上海", "重慶", "石家莊", "太原", "呼和浩特", "哈爾濱", "長(zhǎng)春", "沈陽(yáng)", "濟(jì)南", "南京", "合肥", "杭州", "南昌", "福州", ? ?"鄭州", "武漢", "長(zhǎng)沙", "廣州", "南寧", "西安", "銀川", "蘭州", "西寧", "烏魯木齊", "成都", "貴陽(yáng)", "昆明", "拉薩", "海口"];// 構(gòu)造數(shù)據(jù)while (randomCount--) { ? ?var cityCenter = mapv.utilCityCenter.getCenterByCityName(citys[parseInt(Math.random() * citys.length)]); ? ?data.push({ ? ? ? ?geometry: { ? ? ? ? ? ?type: 'Point', ? ? ? ? ? ?coordinates: [cityCenter.lng - 2 + Math.random() * 4, cityCenter.lat - 2 + Math.random() * 4] ? ? ? ?}, ? ? ? ?count: 30 * Math.random(), ? ? ? ?time: 100 * Math.random() ? ?});}var dataSet = new mapv.DataSet(data);

Step 2.?構(gòu)造?options?參數(shù)：
????options參數(shù)參考Mapv框架的原生API創(chuàng)建，更多詳細(xì)信息參考Mapv官方教程；

• Example:

  ?var options = { ? ? ? context: '2d', ? ? ? size: 13, ? ? ? gradient: { ? ? ? ? ? 0.25: "rgb(0,0,255)", ? ? ? ? ? 0.55: "rgb(0,255,0)", ? ? ? ? ? 0.85: "yellow", ? ? ? ? ? 1.0: "rgb(255,0,0)" ? ? ? }, ? ? ? max: 60, ? ? ? animation: { ? ? ? ? ? type: 'time', ? ? ? ? ? stepsRange: { ? ? ? ? ? ? ?start: 0, ? ? ? ? ? ? ? end: 100 ? ? ? ? ? }, ? ? ? ? ? trails: 10, ? ? ? ? ? duration: 4, ? ? ? }, ? ? ? draw: 'heatmap' ? }

Step 3.?數(shù)據(jù)展示：
????根據(jù)前面的步驟，將?map?、?dataSet?、?options?三個(gè)參數(shù)傳入?CesiumZondy.Overlayer.MapvLayer?中創(chuàng)建對(duì)象，創(chuàng)建完成數(shù)據(jù)在三維場(chǎng)景中加載展示。

• Example:

  ? var mapvLayer = new CesiumZondy.Overlayer.MapvLayer(map, dataSet, options);

客戶端空間分析

????在三維場(chǎng)景中接入第三方開源空間分析庫(kù)Turf.js，支持客戶端實(shí)現(xiàn)緩沖區(qū)分析、泰森多邊形、TIN三角網(wǎng)、中心點(diǎn)、插值、光滑曲線、求交判斷等功能。

Turf.js： turf是JavaScript編寫的模塊化地理空間引擎，具體使用請(qǐng)查看turf官方教程和下載

GeoJSON.js： 地理數(shù)據(jù)轉(zhuǎn)換成GeoJSON格式，GeoJSON.js官方地址

????以緩沖區(qū)分析為例，給定一個(gè)緩沖半徑進(jìn)行緩沖區(qū)分析，單位支持?miles 米，kilometers 千米，degrees 度。

????具體實(shí)現(xiàn)：先通過Cesium三維球控件?Cesium.WebSceneControl()?加載三維場(chǎng)景控件后，使用?Turf.js?空間分析庫(kù)的?turf.buffer()?方法進(jìn)行緩沖區(qū)分析。

Step 1.?執(zhí)行緩沖區(qū)分析：
???? 準(zhǔn)備點(diǎn)、線、面要素?cái)?shù)據(jù)，根據(jù)緩沖區(qū)分析算法得到緩沖區(qū)分析結(jié)果，實(shí)現(xiàn)關(guān)鍵步驟如下：

??（1）準(zhǔn)備點(diǎn)、線、面要素?cái)?shù)據(jù)

• Example:

  var origindata = { ? "type": "FeatureCollection", ? "features": [{ ? ? ? "type": "Feature", ? ? ? "properties": {}, ? ? ? "geometry": { ? ? ? ? "type": "Point", ? ? ? ? "coordinates": [114.24270629882811,30.622550184776674] ? ? ? } ? ? }, ? ? { ? ? ? "type": "Feature", ? ? ? "properties": {}, ? ? ? "geometry": { ? ? ? ? "type": "LineString", ? ? ? ? "coordinates": [ ? ? ? ? ? [114.34810638427734,30.634958017061198], ? ? ? ? ? [114.2856216430664,30.554869984737515], ? ? ? ? ? [114.246826171875,30.4954261715298] ? ? ? ? ] ? ? ? } ? ? }, ? ? { ? ? ? "type": "Feature", ? ? ? "properties": {}, ? ? ? "geometry": { ? ? ? ? "type": "Polygon", ? ? ? ? "coordinates": [ ? ? ? ? ? [ ? ? ? ? ? ? [114.33815002441406,30.502230042106245], ? ? ? ? ? ? [114.34398651123045,30.485071542395932], ? ? ? ? ? ? [114.3728256225586,30.472348632640834], ? ? ? ? ? ? [114.38278198242188,30.49010107130931], ? ? ? ? ? ? [114.35256958007811,30.50518809826035], ? ? ? ? ? ? [114.33815002441406,30.502230042106245] ? ? ? ? ? ] ? ? ? ? ] ? ? ? } ? ? } ? ] };

??（2）執(zhí)行?緩沖區(qū)分析算法，返回緩沖結(jié)果要素?cái)?shù)據(jù)

• Example:

  geojson = turf.buffer(origindata, 1.5, { ? units: 'miles' });

Step 2.?顯示緩沖區(qū)分析結(jié)果：
???? 更新數(shù)據(jù)，將得到的緩沖結(jié)果要素?cái)?shù)據(jù)添加到地圖中。

• Example:

  ?map.dataSources.add(Cesium.GeoJsonDataSource.load(geojson, { ? ? stroke: Cesium.Color.BLACK, ? ? fill: Cesium.Color.GRAY, ? ? strokeWidth: 15 ? }));