完善

src/views/Map3d/Map3DMain.vue

@@ -22,12 +22,14 @@
 	// const SpecialEffects = defineAsyncComponent(() => import('./components/special-effects.vue'));
 	// const coordsTool = defineAsyncComponent(() => import('./components/coordsTool.vue'));
 	// const basicLayer = defineAsyncComponent(() => import('./components/basicLayer.vue'));
-	const queryKeyword = defineAsyncComponent(() => import('./components/query-keyword.vue'));
+	// const queryKeyword = defineAsyncComponent(() => import('./components/query-keyword.vue'));
 	// const toolbars = defineAsyncComponent(() => import('./components/toolbars.vue'));
 	// const map3d = defineAsyncComponent(() => import('./components/map.vue'));
+
+	const navigation = defineAsyncComponent(() => import('./components/navigation.vue'));
+
 	import map3d from './components/map.vue';
 	// import queryKeyword from './components/query-keyword.vue';
-	
 	import toolbars from './components/toolbars.vue';
 	import layer from './components/layer.vue';
 	import measure from './components/measure.vue';
@@ -79,15 +81,18 @@
 			<basicLayer v-show="showbasicLayer" ref="basicLayers"></basicLayer>
 
 			<!-- 弹出框组件，tabs组件测试 -->
-			<jt-popup  title="地区导航" ref="refmapNavigate" :isEmit="true" @closeJTPopup="closeMapNavigate">
+			<jt-popup title="地区导航" ref="refmapNavigate" :isEmit="true" @closeJTPopup="closeMapNavigate">
 				<mapNavigate ref="_refmapNavigate"></mapNavigate>
 			</jt-popup>
 
 			<!-- 关键字查询组件 -->
-			<queryKeyword ref="queryword" />
+			<!-- <queryKeyword ref="queryword" /> -->
+
+			<!-- 比例尺、指南针 -->
+			<navigation ref="refNavigation"/>
 
 			<!-- 视角标签 -->
-			<jt-popup  title="视角标签" ref="refviewerlabel">
+			<jt-popup title="视角标签" ref="refviewerlabel">
 				<viewerlabel ref="_refviewerlabel"></viewerlabel>
 			</jt-popup>
 
@@ -100,12 +105,12 @@
 			<toolbars />
 
 			<!-- 图上量算组件 -->
-			<jt-popup  title="图上量算" ref="refMeasure" :isEmit="true" @closeJTPopup="closeMeasure">
+			<jt-popup title="图上量算" ref="refMeasure" :isEmit="true" @closeJTPopup="closeMeasure">
 				<measure ref="_refMeasure" />
 			</jt-popup>
 
 			<!-- 数据分析组件 -->
-			<jt-popup  title="数据分析" ref="refAnalysisData">
+			<jt-popup title="数据分析" ref="refAnalysisData">
 				<analysisData />
 			</jt-popup>
 
@@ -120,7 +125,7 @@
 			</jt-drawer>
 
 			<!-- 图形查询组件 -->
-			<jt-popup  title="图形查询" ref="refQueryGraphics" :isEmit="true" @closeJTPopup="closeQuery">
+			<jt-popup title="图形查询" ref="refQueryGraphics" :isEmit="true" @closeJTPopup="closeQuery">
 				<queryGraphics ref="_refQueryGraphics" />
 			</jt-popup>
 
@@ -155,8 +160,8 @@
 			</jt-popup>
 
 			<!-- 图层控jt-popup制组件 -->
-			<jt-popup title="图层控制" ref="refLayer">
-				<layer />
+			<jt-popup title="图层控制" ref="refLayerPopup">
+				<layer ref="refLayer"/>
 			</jt-popup>
 
 			<!--图上绘制组件-->
@@ -191,7 +196,7 @@
 		 */
 		data() {
 			return {
-				isshowfooter:false,
+				isshowfooter: false,
 				mapLoaded: false,
 				showbasicLayer: false, //控制地图组件显示隐藏
 				ChartTestData: {}, //剖面分析结果chart
@@ -451,16 +456,16 @@
 				jt3d = map;
 				this.mapLoaded = true;
 			},
-			
-			
+
+
 
 		},
 		created() {
 			store.markID = ''
-			store.queryMapTables=[]
+			store.queryMapTables = []
 		},
 		mounted() {
-			
+
 		}
 	};
 </script>

src/views/Map3d/components/ImageLayerSplit.vue

@@ -266,6 +266,10 @@
 					default:
 						break;
 				}
+
+				//图层定位
+				this.$parent.$parent.$refs.refLayer.mark = "service";
+				this.$parent.$parent.$refs.refLayer.setLayersLocation(jt3d, data);
 			},
 			/**
 			 * 
@@ -497,6 +501,10 @@
 					default:
 						break;
 				}
+
+				//图层定位
+				this.$parent.$parent.$refs.refLayer.mark = "service";
+				this.$parent.$parent.$refs.refLayer.setLayersLocation(jt3d, data);
 			},
 
 			/**
@@ -684,7 +692,6 @@
 				//初始图层列表
 				this.initData = res.data
 				init().then(item => {
-					
 				})
 			})
 		},

src/views/Map3d/components/ViewerSplitScreen.vue

@@ -22,7 +22,7 @@
 				<el-checkbox v-if="data.ischeck === '1' && store.userport == 'PC'" v-model="node.checked" :indeterminate="node.indeterminate" :disabled="!!node.disabled" @change="handleCheckBoxChange($event, data, node)">
 				</el-checkbox>
 				<el-switch v-else-if="data.ischeck == 1 && store.userport == 'APP'" width="30rem" size="small" v-model="node.checked" @change="handleCheckBoxChange($event, data, node)" />
-				<span class="custom-tree-node" @click="handleClick(data)">
+				<span class="custom-tree-node" @click="handleClick(data)" style="width: 150rem;text-align: left;">
 					<!-- 字体、图标 -->
 					<!-- <span>
 						<img src="@/assets/images/logo16x16.ico" />
@@ -47,6 +47,7 @@
 	let store = undefined;
 	let jt3dRight = undefined;
 	let jt3dLeft = undefined;
+
 	export default {
 
 		/* 数据 */
@@ -62,142 +63,24 @@
 		/* 方法 */
 		methods: {
 			/**
-			 * el-tree 当节点被点击的时候触发
-			 * 控制地图服务的显示及隐藏
+			 * 单击图层名称触发服务定位
 			 * @param {Object} data 传递给 data 属性的数组中该节点所对应的对象
 			 */
-			async handleClick(data) {
-				let _self = this;
-
-				let _serviceId = "serviceLeft_" + data.layercode + data.layerorder;
-				let layername = data.layername;
-
-				//透明度
-				let _opacity = null;
-				if (data.opacity == null) {
-					_opacity = 1;
-				} else {
-					_opacity = Number(data.opacity);
-					data.opacity = _opacity;
-
-					if (_opacity == 0) {
-						_opacity = 1;
-					}
-				}
-
-				//参数集
-				let parameterset = data.parameterset;
-				if (data.parameterset instanceof Object) {
-					parameterset = data.parameterset;
-				} else if (data.parameterset != "" && data.parameterset != null && data.parameterset != undefined) {
-					parameterset = JSON.parse(data.parameterset);
-				}
-
-				if (data.isinit === '1') {
-					await new Promise((resolve, reject) => {
-						switch (data.loadtype) {
-							case "GeoJsonPolyline": //GeoJsonPolyline
-
-								break;
-							case "entitiesGltf": //gltf/glb
-
-								if (parameterset) {
-									if (parameterset.points) { //模型位置
-										let flyToEntity = jt3dLeft.LocateUtil.flyToEntityByPoints([
-											parameterset.points,
-										], 'point', {
-											heading: 0,
-											pitch: -90,
-											range: 8880
-										});
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置points");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置points");
-								}
-
-								break;
-							case "PolygonImageMaterial": //图片材质
-
-								break;
-							case "CrImageServerLayer": //地形服务（DEM）
-
-								break;
-							case "DEM": //地形服务（DEM）
-
-								break;
-							case "UrlTemplateImageryProvider": //加载URL模板服务
-
-								break;
-							case "WebMapTileServiceImageryProvider": // WMTS地图服务
-
-								break;
-							case "WebMapServiceImageryProvider": //WMS地图服务
-
-								break;
-							case "ArcGisMapServerImageryProvider": // ArcGIS Online和Server的相关服务
-
-								break;
-							case "TileMapServiceImageryProvider": // 2.5维度地图
-
-								break;
-							case "Cesium3DTileset": //加载3DTileset地图服务--实景
-								if (window[_serviceId]) {
-									jt3dLeft._viewer.flyTo(window[_serviceId], {
-										offset: {
-											heading: Cesium.Math.toRadians(20.0), //方向
-											pitch: Cesium.Math.toRadians(-90), //倾斜角度
-											range: 1000
-										}
-									});
-								}
-								break;
-							case "Cesium3DTileset_BM": //加载3DTileset地图服务--白膜
-
-								break;
-							default:
-								break;
-						}
-					})
-				}
+			handleClick(data) {
+				this.$parent.$parent.$refs.refLayer.mark = "serviceLeft";
+				this.$parent.$parent.$refs.refLayer.inittree = this.inittree;
+				this.$parent.$parent.$refs.refLayer.setLayersLocation(jt3dLeft, data);
 			},
 
 			/**
-			 * el-slider 值改变时触发（使用鼠标拖曳时，只在松开鼠标后触发）
+			 * el-slider 值改变时触发
 			 * 地图服务的透明度调整
 			 */
 			handleSliderChange($event, data) {
-				let _serviceId = "serviceLeft_" + data.layercode + data.layerorder;
-				if (data.loadtype === "Cesium3DTileset") {
-					//设置实景透明度
-					jt3dLeft.layer.set3DTileStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else if (data.loadtype === "CrImageServerLayer") {
-					let floatLayer = window[_serviceId];
-					floatLayer.setOpacity($event)
-				} else if (data.loadtype === "PolygonImageMaterial") {
-					//设置透明度
-					jt3dLeft.layer.setPolygonImageMaterial({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else if (data.loadtype === "entitiesGltf") {
-					//设置透明度
-					jt3dLeft.layer.setModelStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else {
-					jt3dLeft.layer.setLayersStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				}
+				this.$parent.$parent.$refs.refLayer.mark = "serviceLeft";
+				this.$parent.$parent.$refs.refLayer.inittree = this.inittree;
+				this.$parent.$parent.$refs.refLayer.setLayersAlpha(jt3dLeft, $event, data)
 			},
-
 			/**
 			 * el-checkbox 当绑定值变化时触发的事件
 			 * @param {Object} checked 复选框状态
@@ -205,10 +88,12 @@
 			 * @param {Object} node TreeNode 的 node 属性
 			 */
 			handleCheckBoxChange(checked, data, node) {
+				this.$parent.$parent.$refs.refLayer.mark = "serviceLeft";
+				this.$parent.$parent.$refs.refLayer.inittree = this.inittree;
 
 				let _node = this.$refs.treeRef.getNode(data);
 				if (_node.isLeaf) {
-					this.setLayerControl(data, checked);
+					this.$parent.$parent.$refs.refLayer.setLayersControl(jt3dLeft, data, checked);
 					this.$refs.treeRef.setChecked(_node, checked); //是否设置子节点，默认为false，利用tree组件渲染后带有的isLeaf(是否为叶子节点)属性，如果为叶子节点就选中。利用tree的API就实现了正确的回显效果	
 				}
 
@@ -223,590 +108,13 @@
 			childNodesChange(node, checked) {
 				let _self = this;
 				node.childNodes.forEach(item => {
-					_self.setLayerControl(item.data, checked);
+					_self.$parent.$parent.$refs.refLayer.setLayersControl(jt3dLeft, item.data, checked);
 					_self.$refs.treeRef.setChecked(item, checked);
 					_self.childNodesChange(item, checked);
 				});
 			},
 
 			/**
-			 * 控制地图服务的显示及隐藏
-			 * @param {Object} data 传递给 data 属性的数组中该节点所对应的对象
-			 * @param {Object} checked 节点本身是否被选中
-			 */
-			async setLayerControl(data, checked) {
-				console.log('操作', '图层控制')
-
-				let _self = this;
-
-				let _serviceId = "serviceLeft_" + data.layercode + data.layerorder;
-				let layername = data.layername;
-				let layertype = data.layertype;
-
-				//透明度
-				let _opacity = null;
-				if (data.opacity == null) {
-					_opacity = 1;
-				} else {
-					_opacity = Number(data.opacity);
-					data.opacity = _opacity;
-
-					if (_opacity == 0) {
-						_opacity = 1;
-					}
-				}
-
-				//参数集
-				let parameterset = data.parameterset;
-				if (data.parameterset instanceof Object) {
-					parameterset = data.parameterset;
-				} else if (data.parameterset != "" && data.parameterset != null && data.parameterset != undefined) {
-					parameterset = JSON.parse(data.parameterset);
-				}
-
-				//在显示的图层中，如果图层配置可以查询，则进行查询
-				if (layertype === '矢量面' && data.querytable) {
-					if (checked) {
-						if (store.queryMapTables.indexOf(data.querytable) === -1) {
-							store.queryMapTables.push(data.querytable);
-						}
-					} else {
-						//过滤
-						store.queryMapTables = store.queryMapTables.filter(tableName => {
-							return tableName !== data.querytable
-						})
-					}
-				}
-
-				await new Promise((resolve, reject) => {
-					switch (data.loadtype) {
-						case "GeoJsonPoint": //GeoJsonPoint
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-								}
-
-								if (parameterset) {
-									if (parameterset.billboard instanceof Object) {
-										let billboard = parameterset.billboard;
-										_options.billboard = billboard;
-									}
-
-									if (parameterset.label instanceof Object) {
-										let label = parameterset.label;
-										_options.label = label;
-									}
-								}
-
-
-								jt3dLeft.layer.addBillboardByGeoJson(_options, function(serviceId) {
-
-								});
-
-							} else {
-								jt3dLeft.layer.removeDataSources({
-									serviceId: _serviceId,
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "GeoJsonPolyline": //GeoJsonPolyline
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-								}
-
-								if (parameterset) {
-
-									if (parameterset.clampToGround) { //是否贴地
-										_options.clampToGround = parameterset.clampToGround;
-									}
-									if (parameterset.isImageAlpha) { //是否采用图片颜色
-										_options.isImageAlpha = parameterset.isImageAlpha;
-									}
-									if (parameterset.imgUrl) { //精灵线图片
-										_options.imgUrl = parameterset.imgUrl;
-									}
-									if (parameterset.color) { //指定线的颜色
-										_options.color = parameterset.color;
-									}
-									if (parameterset.width) { //线宽
-										_options.width = parameterset.width;
-									}
-									if (parameterset.duration) { //持续时间 毫秒，越小越快
-										_options.duration = parameterset.duration;
-									}
-									if (parameterset.count) { //重复次数
-										_options.count = parameterset.count;
-									}
-									if (parameterset
-										.direction) { //direction=vertical 纵，order='-'(由下到上) , '+"(由上到下)
-										_options.direction = parameterset.direction;
-									}
-									if (parameterset
-										.order) { //direction=horizontal 横，order='-'(顺时针) , '+'(逆时针)
-										_options.order = parameterset.order;
-									}
-								}
-
-								jt3dLeft.layer.addPolylineByGeoJson(_options, function(serviceId) {
-
-								});
-							} else {
-								jt3dLeft.layer.removeDataSources({
-									serviceId: _serviceId,
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "entitiesGltf": //gltf/glb
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									points: [],
-								}
-
-								if (parameterset) {
-									if (parameterset.points) { //模型位置
-										_options.points = parameterset.points;
-
-										if (parameterset.minimumPixelSize) { //模型最小刻度
-											_options.minimumPixelSize = parameterset.minimumPixelSize;
-										}
-										if (parameterset.maximumScale) { //模型的最大比例尺大小，设置模型最大放大大小
-											_options.maximumScale = parameterset.maximumScale;
-										}
-										if (parameterset.silhouetteColor) { //模型轮廓颜色
-											_options.silhouetteColor = parameterset.silhouetteColor;
-										}
-										if (parameterset.alpha) { //模型透明度
-											_options.alpha = parameterset.alpha;
-										}
-										if (parameterset.heading) { //以弧度为单位的航向分量
-											_options.heading = parameterset.heading;
-										}
-										if (parameterset.pitch) { //以弧度为单位的航向分量
-											_options.pitch = parameterset.pitch;
-										}
-										if (parameterset.roll) { //以弧度为单位的滚动分量
-											_options.roll = parameterset.roll;
-										}
-
-										jt3dLeft.layer.addEntitiesGltf(_options, function(serviceId) {
-											// let flyToEntity = jt3dLeft.LocateUtil.flyToEntityByPoints([
-											// 	parameterset.points,
-											// ], 'point');
-										});
-
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置points");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置points");
-								}
-							} else {
-								jt3dLeft.layer.removeEntity({
-									serviceId: _serviceId,
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "PolygonImageMaterial": //图片材质
-							if (checked) {
-								data.isinit = '1';
-
-								if (parameterset) {
-									if (parameterset.points) {
-										jt3dLeft.layer.addPolygonImageMaterial({
-											id: _serviceId,
-											points: parameterset.points,
-											url: data.datasource,
-											alpha: _opacity
-										}, function(serviceId) {
-
-										});
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置points");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置points");
-								}
-							} else {
-								jt3dLeft.layer.removeEntity({
-									serviceId: _serviceId,
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "CrImageServerLayer": //贴地所有地形、模型的规划图、网格地图
-							if (checked) {
-								data.isinit = '1';
-
-								let floatLayer = new this.jt3dSDK.CrImageServerLayer({
-									viewer: window["viewer"],
-									url: data.datasource,
-									opacity: _opacity,
-									show: true
-								});
-								window[_serviceId] = floatLayer;
-								//添加网格地图
-								// window[_serviceId].show();
-							} else {
-								window[_serviceId].hide();
-								data.isinit = '0';
-							}
-							break;
-						case "DEM": //地形服务（DEM）
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									url: data.datasource,
-								}
-								if (parameterset) {
-									if (parameterset.terrainExaggeration) { //地形夸张系数
-										_options.terrainExaggeration = parameterset.terrainExaggeration;
-									}
-								}
-								jt3dLeft.layer.addTerrain(_options);
-							} else {
-								jt3dLeft.layer.removeTerrain().then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "UrlTemplateImageryProvider": //加载URL模板服务
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									alpha: _opacity
-								}
-								if (parameterset) {
-									if (parameterset.CRS) { //坐标系
-										_options.CRS = parameterset.CRS;
-									}
-									if (parameterset.minimumLevel) { //最小层级
-										_options.minimumLevel = parameterset.minimumLevel;
-									}
-									if (parameterset.maximumLevel) { //最大层级
-										_options.maximumLevel = parameterset.maximumLevel;
-									}
-								}
-
-								//加载服务
-								jt3dLeft.layer.addUrlTemplateImagery(_options, function(serviceId) {
-
-									//重置图层顺序
-									_self.setLayerNumber(serviceId)
-								});
-							} else {
-								jt3dLeft.layer.removeImageryProvider({
-									serviceId: _serviceId
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-
-							break;
-						case "WebMapTileServiceImageryProvider": // WMTS地图服务
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									layers: 'cia',
-									style: 'default',
-									tileMatrixSetID: 'w',
-									alpha: _opacity
-								}
-								if (parameterset) {
-									if (parameterset.layers) { //WMTS请求的层名
-										_options.layers = parameterset.layers;
-
-										if (parameterset.style) { //WMTS请求的样式名
-											_options.style = parameterset.style;
-
-											if (parameterset.tileMatrixSetID) { //用于WMTS请求的TileMatrixSet的标识符
-												_options.tileMatrixSetID = parameterset.tileMatrixSetID;
-
-												if (parameterset.minimumLevel) { //最小层级
-													_options.minimumLevel = parameterset.minimumLevel;
-												}
-												if (parameterset.maximumLevel) { //最大层级
-													_options.maximumLevel = parameterset.maximumLevel;
-												}
-
-												jt3dLeft.layer.addWebMapTileService(_options, function(serviceId) {
-
-													//重置图层顺序
-													_self.setLayerNumber(serviceId)
-												});
-
-											} else {
-												ElMessage("请检测图层表parameterset字段是否设置tileMatrixSetID");
-											}
-
-										} else {
-											ElMessage("请检测图层表parameterset字段是否设置style");
-										}
-
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置layers");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置layers,style,tileMatrixSetID");
-								}
-
-							} else {
-								jt3dLeft.layer.removeImageryProvider({
-									serviceId: _serviceId
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "WebMapServiceImageryProvider": //WMS地图服务
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									layers: "SDYTMP:map_zrzy_water_polylon",
-									alpha: _opacity
-								}
-								if (parameterset) {
-									if (parameterset.layers) { //WMTS请求的层名
-										_options.layers = parameterset.layers;
-
-										if (parameterset.minimumLevel) { //最小层级
-											_options.minimumLevel = parameterset.minimumLevel;
-										}
-										if (parameterset.maximumLevel) { //最大层级
-											_options.maximumLevel = parameterset.maximumLevel;
-										}
-
-										jt3dLeft.layer.addWebMapService(_options, function(serviceId) {
-
-											//重置图层顺序
-											_self.setLayerNumber(serviceId)
-										});
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置layers");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置layers");
-								}
-							} else {
-								jt3dLeft.layer.removeImageryProvider({
-									serviceId: _serviceId
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "ArcGisMapServerImageryProvider": // ArcGIS Online和Server的相关服务
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									alpha: _opacity
-								}
-								if (parameterset) {
-									if (parameterset.layers) {
-										_options.layers = parameterset.layers;
-									}
-								}
-
-								//加载服务
-								jt3dLeft.layer.addArcGisMapServer(_options, function(serviceId) {
-
-									//重置图层顺序
-									_self.setLayerNumber(serviceId)
-								})
-							} else {
-								jt3dLeft.layer.removeImageryProvider({
-									serviceId: _serviceId
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "TileMapServiceImageryProvider": // 2.5维度地图
-							if (checked) {
-								data.isinit = '1';
-
-								//设置参数
-								let _options = {
-									id: _serviceId,
-									url: data.datasource,
-									alpha: _opacity
-								}
-								if (parameterset) {
-									if (parameterset.minimumLevel) { //最小层级
-										_options.minimumLevel = parameterset.minimumLevel;
-									}
-									if (parameterset.maximumLevel) { //最大层级
-										_options.maximumLevel = parameterset.maximumLevel;
-									}
-								}
-
-								jt3dLeft.layer.addTileMapServiceImagery(_options, function(serviceId) {
-
-									//重置图层顺序
-									_self.setLayerNumber(serviceId)
-								});
-							} else {
-								jt3dLeft.layer.removeImageryProvider({
-									serviceId: _serviceId
-								}).then(res => {
-									data.isinit = '0';
-								});
-							}
-							break;
-						case "Cesium3DTileset": //加载3DTileset地图服务--实景
-
-							if (checked) {
-								data.isinit = '1';
-
-								if (window[_serviceId]) {
-									window[_serviceId].show = true;
-								} else {
-									//设置参数
-									let _options = {
-										id: _serviceId,
-										url: data.datasource,
-									}
-									if (parameterset) {
-										if (parameterset.height) {
-											_options.height = parameterset.height;
-										}
-										if (parameterset.alpha) {
-											_options.alpha = parameterset.alpha;
-										}
-									}
-									//加载实景
-									jt3dLeft.layer.addCesium3DTileset(_options, function(serviceId) {
-										window[_serviceId].show = true;
-									});
-								}
-							} else {
-								if (window[_serviceId]) {
-									//3DTileset数据量比较大，会报很多cesium错误
-									// jt3dLeft.layer.removeScenePrimitives({
-									// 	serviceId: _serviceId
-									// }).then(res => {
-									// 	data.isinit = '0';
-									// });
-
-									window[_serviceId].show = false;
-									data.isinit = '0';
-								}
-							}
-
-							break;
-						case "Cesium3DTileset_BM": //加载3DTileset地图服务--白膜
-							if (checked) {
-								data.isinit = '1';
-
-								if (window[_serviceId]) {
-									window[_serviceId].show = true;
-								} else {
-									//设置参数
-									let _options = {
-										id: _serviceId,
-										url: data.datasource,
-									}
-									if (parameterset) {
-										if (parameterset.color) {
-											_options.color = parameterset.color;
-										}
-									}
-
-									//加载白膜
-									jt3dLeft.layer.addCesium3DTilesetBm(_options, function(serviceId) {
-										window[_serviceId].show = true;
-									});
-								}
-							} else {
-								if (window[_serviceId]) {
-									// jt3dLeft.layer.removeScenePrimitives({
-									// 	serviceId: _serviceId
-									// }).then(res => {
-									// 	data.isinit = '0';
-									// });
-
-									window[_serviceId].show = false;
-									data.isinit = '0';
-								}
-							}
-							break;
-						default:
-							break;
-					}
-				})
-			},
-
-
-			/**
-			 * 设置图层顺序
-			 * @param {Object} options
-			 */
-			setLayerNumber(serviceId) {
-				var imageryLayers = jt3dLeft._viewer.imageryLayers;
-				if (store.markID) {
-					console.log('标注id', store.markID)
-					imageryLayers.raiseToTop(window[store.markID]); //标注层置顶
-				}
-
-				imageryLayers.lowerToBottom(window[serviceId]); //设置图层初始顺序
-				imageryLayers.raise(window[serviceId]);
-				imageryLayers.raise(window[serviceId]);
-				this.inittree.forEach(res => {
-					if (res.layercode && res.layerorder) {
-						let id = "service_" + res.layercode + res.layerorder
-						let startid = Number(res.layercode + res.layerorder)
-						let strid = Number(serviceId.substring(8))
-						if (imageryLayers.contains(window[id])) {
-							if (startid < strid) {
-								imageryLayers.raise(window[serviceId])
-							} else {
-								// imageryLayers.raiseToTop(window[store.markID]);
-								// break;
-							}
-						}
-					}
-				})
-			},
-
-			/**
 			 * 分屏对比初始化
 			 */
 			initSplitScreen() {
@@ -899,7 +207,7 @@
 				jt3dLeft.PolylineObject = new this.jt3dSDK.PolylineObject(jt3dLeft._viewer);
 
 				//比例尺、指南针
-				this.$parent.$parent.$refs.queryword.initNavigation(jt3dLeft);
+				this.$parent.$parent.$refs.refNavigation.initNavigation(jt3dLeft);
 
 				//设置默认视图
 				this.$parent.$parent.$refs.refMap3d.setView(jt3dLeft);
@@ -979,6 +287,7 @@
 			 * 加载图层控制树
 			 */
 			initTree() {
+
 				//在这获取图层列表
 				let _this = this
 				//权限查询条件语句
@@ -1008,7 +317,7 @@
 							// 复选框默认选中
 							if (res.isinit === '1') {
 								_this.checkedkeys.push(res.id);
-								_this.setLayerControl(res, true);
+								_this.$parent.$parent.$refs.refLayer.setLayersControl(jt3dLeft, res, true);
 							}
 						})
 
@@ -1026,10 +335,16 @@
 				}).then(res => {
 					console.log('所有图层', res.data)
 					//初始图层列表
-					this.inittree = res.data
+					this.inittree = res.data;
+
+					this.$parent.$parent.$refs.refLayer.mark = "serviceLeft";
+					this.$parent.$parent.$refs.refLayer.inittree = this.inittree;
+
 					init(res.data).then(item => {
 						console.log('图层控制树列表', _this.treeData)
-						
+
+
+
 						//复选框初始化选中
 						_this.$nextTick(() => {
 							_this.$refs.treeRef.setCheckedKeys(_this.checkedkeys, true);

src/views/Map3d/components/analysis-space.vue

@@ -26,7 +26,7 @@
 					<el-button color="rgb(255 100 100)" @click="SunShine('remove')"><span style="color: #fff;">移除光照分析</span></el-button>
 				</div>
 			</el-collapse-item>
-			<el-collapse-item name="方量分析">
+			<!-- <el-collapse-item name="方量分析">
 				<template #title>
 					<i class='iconfont icon-svgfangliangfenxi' />方量分析
 				</template>
@@ -61,7 +61,7 @@
 						</el-form-item>
 					</el-form>
 				</div>
-			</el-collapse-item>
+			</el-collapse-item> -->
 			<el-collapse-item name="剖面分析">
 				<template #title>
 					<i class='iconfont icon-svgpoumianfenxi' />剖面分析
@@ -97,7 +97,7 @@
 					<el-button color="rgb(255 100 100)" @click="ViewShed('deactivate')"><span style="color: #fff;">清除视域</span></el-button>
 				</div>
 			</el-collapse-item>
-			<el-collapse-item name="限高分析">
+		<!-- 	<el-collapse-item name="限高分析">
 				<template #title>
 					<i class='iconfont icon-svgxiangaofenxi' />限高分析
 				</template>
@@ -118,7 +118,7 @@
 						<el-button color="rgb(255 100 100)" @click="HeightLimit('deactivate')"><span style="color: #fff;">清除限高分析</span></el-button>
 					</div>
 				</div>
-			</el-collapse-item>
+			</el-collapse-item> -->
 			<!-- <el-collapse-item name="剖切展示">
 				<template #title>
 					<i class='iconfont icon-svgpouqiezhanshi' />剖切展示

src/views/Map3d/components/basicLayer.vue

@@ -201,21 +201,24 @@
 							parameterset = JSON.parse(item.parameterset);
 						}
 
-						if (item.isinit === '1' && item.layertype === '地形') {
-							_self.terrainData.isterrain = true;
+						if (item.layertype === '地形') {
 							_self.terrainData.terrainUrl = item.datasource;
-
 							if (parameterset) {
 								if (parameterset.terrainExaggeration) { //地形夸张系数
 									_self.terrainData.terrainExaggeration = parameterset
 										.terrainExaggeration;
 								}
 							}
+						}
+						if (item.layertype === '标注') {
+							_self.markData.markUrl = item.datasource;
+						}
 
+						if (item.isinit === '1' && item.layertype === '地形') {
+							_self.terrainData.isterrain = true;
 							_self.addTerrain();
 						} else if (item.isinit === '1' && item.layertype === '标注') {
 							_self.markData.ismark = true;
-							_self.markData.markUrl = item.datasource;
 							_self.addMark();
 						} else if (item.isinit === '1') {
 							_self.selectImg = item.layerorder;
@@ -235,7 +238,6 @@
 								imageryLayers.lowerToBottom(window[_self.layerID]);
 								imageryLayers.raise(window[_self.layerID]);
 							});
-
 						}
 
 						if (item.datasource && item.datasource != '#' && item.layertype != '地形' && item.layertype != '标注') {

src/views/Map3d/components/layer.vue

@@ -26,13 +26,13 @@
 		<!-- :default-checked-keys="checkedkeys"  默认勾选的节点的 key 的数组-->
 		<!-- :default-expanded-keys="expandedKeys" 默认展开的节点的 key 的数组-->
 		<!-- @node-click 节点单击事件 -->
-		<el-tree :data="treeData" :default-expanded-keys="expandedKeys" :default-checked-keys="checkedkeys" node-key="id" class="tree-line" ref="treeRef" >
+		<el-tree :data="treeData" :default-expanded-keys="expandedKeys" :default-checked-keys="checkedkeys" node-key="id" class="tree-line" ref="treeRef">
 			<template #default="{ node, data }">
 				<!-- 复选框 -->
 				<el-checkbox v-if="data.ischeck == '1' && store.userport == 'PC'" v-model="node.checked" :indeterminate="node.indeterminate" :disabled="!!node.disabled" @change="handleCheckBoxChange($event, data, node)">
 				</el-checkbox>
 				<el-switch v-else-if="data.ischeck == 1 && store.userport == 'APP'" width="30rem" size="small" v-model="node.checked" @change="handleCheckBoxChange($event, data, node)" />
-				<span class="custom-tree-node"  @click="handleClick(data)">
+				<span class="custom-tree-node" @click="handleClick(data)" style="width: 150rem;text-align: left;">
 					<!-- 字体、图标 -->
 					<!-- <span>
 						<img src="@/assets/images/logo16x16.ico" />
@@ -70,6 +70,7 @@
 		/* 数据 */
 		data() {
 			return {
+				mark: 'service',
 				treeData: [],
 				inittree: [], //初始化图层数组
 				expandedKeys: [], //对应要展开的节点id
@@ -80,106 +81,12 @@
 		/* 方法 */
 		methods: {
 			/**
-			 * el-tree 当节点被点击的时候触发
-			 * 控制地图服务的显示及隐藏
+			 * 单击图层名称触发服务定位
 			 * @param {Object} data 传递给 data 属性的数组中该节点所对应的对象
 			 */
-			async handleClick(data) {
-				console.log('操作', '单击定位')
-				let _self = this;
-
-				let _serviceId = "service_" + data.layercode + data.layerorder;
-				let layername = data.layername;
-
-				//透明度
-				let _opacity = null;
-				if (data.opacity == null) {
-					_opacity = 1;
-				} else {
-					_opacity = Number(data.opacity);
-					data.opacity = _opacity;
-
-					if (_opacity == 0) {
-						_opacity = 1;
-					}
-				}
-
-				//参数集
-				let parameterset = data.parameterset;
-				if (data.parameterset instanceof Object) {
-					parameterset = data.parameterset;
-				} else if (data.parameterset != "" && data.parameterset != null && data.parameterset != undefined) {
-					parameterset = JSON.parse(data.parameterset);
-				}
-
-				if (data.isinit === '1') {
-					await new Promise((resolve, reject) => {
-						switch (data.loadtype) {
-							case "GeoJsonPolyline": //GeoJsonPolyline
-
-								break;
-							case "entitiesGltf": //gltf/glb
-
-								if (parameterset) {
-									if (parameterset.points) { //模型位置
-										let flyToEntity = jt3d.LocateUtil.flyToEntityByPoints([
-											parameterset.points,
-										], 'point', {
-											heading: 0,
-											pitch: -90,
-											range: 8880
-										});
-									} else {
-										ElMessage("请检测图层表parameterset字段是否设置points");
-									}
-								} else {
-									ElMessage("请检测图层表parameterset字段是否设置points");
-								}
-
-								break;
-							case "PolygonImageMaterial": //图片材质
-
-								break;
-							case "CrImageServerLayer": //地形服务（DEM）
-
-								break;
-							case "DEM": //地形服务（DEM）
-
-								break;
-							case "UrlTemplateImageryProvider": //加载URL模板服务
-
-								break;
-							case "WebMapTileServiceImageryProvider": // WMTS地图服务
-
-								break;
-							case "WebMapServiceImageryProvider": //WMS地图服务
-
-								break;
-							case "ArcGisMapServerImageryProvider": // ArcGIS Online和Server的相关服务
-
-								break;
-							case "TileMapServiceImageryProvider": // 2.5维度地图
-
-								break;
-							case "Cesium3DTileset": //加载3DTileset地图服务--实景
-								if (window[_serviceId]) {
-									jt3d._viewer.flyTo(window[_serviceId], {
-										offset: {
-											heading: Cesium.Math.toRadians(20.0), //方向
-											pitch: Cesium.Math.toRadians(-90), //倾斜角度
-											range: 1000
-										}
-									});
-								}
-								break;
-							case "Cesium3DTileset_BM": //加载3DTileset地图服务--白膜
-
-								break;
-							default:
-								break;
-						}
-					})
-				}
+			handleClick(data) {
+				this.mark = 'service';
+				this.setLayersLocation(jt3d, data);
 			},
 
 			/**
@@ -187,34 +94,8 @@
 			 * 地图服务的透明度调整
 			 */
 			handleSliderChange($event, data) {
-				let _serviceId = "service_" + data.layercode + data.layerorder;
-				if (data.loadtype === "Cesium3DTileset") {
-					//设置实景透明度
-					jt3d.layer.set3DTileStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else if (data.loadtype === "CrImageServerLayer") {
-					let floatLayer = window[_serviceId];
-					floatLayer.setOpacity($event)
-				} else if (data.loadtype === "PolygonImageMaterial") {
-					//设置透明度
-					jt3d.layer.setPolygonImageMaterial({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else if (data.loadtype === "entitiesGltf") {
-					//设置透明度
-					jt3d.layer.setModelStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				} else {
-					jt3d.layer.setLayersStyle({
-						serviceId: _serviceId,
-						alpha: $event,
-					});
-				}
+				this.mark = 'service';
+				this.setLayersAlpha(jt3d, $event, data)
 			},
 
 			/**
@@ -224,10 +105,10 @@
 			 * @param {Object} node TreeNode 的 node 属性
 			 */
 			handleCheckBoxChange(checked, data, node) {
-				
+				this.mark = 'service';
 				let _node = this.$refs.treeRef.getNode(data);
 				if (_node.isLeaf) {
-					this.setLayerControl(data, checked);
+					this.setLayersControl(jt3d, data, checked);
 					this.$refs.treeRef.setChecked(_node, checked); //是否设置子节点，默认为false，利用tree组件渲染后带有的isLeaf(是否为叶子节点)属性，如果为叶子节点就选中。利用tree的API就实现了正确的回显效果	
 
 				} else {
@@ -244,7 +125,7 @@
 			childNodesChange(node, checked) {
 				let _self = this;
 				node.childNodes.forEach(item => {
-					_self.setLayerControl(item.data, checked);
+					_self.setLayersControl(jt3d, item.data, checked);
 					_self.$refs.treeRef.setChecked(item, checked);
 					_self.childNodesChange(item, checked);
 				});
@@ -255,14 +136,15 @@
 			 * @param {Object} data 传递给 data 属性的数组中该节点所对应的对象
 			 * @param {Object} checked 节点本身是否被选中
 			 */
-			async setLayerControl(data, checked) {
+			async setLayersControl(jt3d, data, checked) {
 				console.log('操作', '图层控制')
 
 				let _self = this;
 
-				let _serviceId = "service_" + data.layercode + data.layerorder;
+				let _serviceId = this.mark + "_" + data.layercode + data.layerorder;
 				let layername = data.layername;
 				let layertype = data.layertype;
+				let atlastype = data.atlastype;
 
 				//透明度
 				let _opacity = null;
@@ -476,11 +358,12 @@
 							}
 							break;
 						case "CrImageServerLayer": //贴地所有地形、模型的规划图、网格地图
+
 							if (checked) {
 								data.isinit = '1';
 
 								let floatLayer = new this.jt3dSDK.CrImageServerLayer({
-									viewer: window["viewer"],
+									viewer: jt3d._viewer,
 									url: data.datasource,
 									opacity: _opacity,
 									show: true
@@ -539,7 +422,16 @@
 								jt3d.layer.addUrlTemplateImagery(_options, function(serviceId) {
 
 									//重置图层顺序
-									_self.setLayerNumber(serviceId)
+									_self.setLayerNumber(jt3d, serviceId)
+									if (atlastype === "底图") {
+										var imageryLayers = jt3d._viewer.imageryLayers;
+										imageryLayers.lowerToBottom(window[serviceId]);
+										imageryLayers.raise(window[serviceId]);
+										if (layertype === '标注') {
+											var imageryLayers = jt3d._viewer.imageryLayers;
+											imageryLayers.raiseToTop(window[serviceId]);
+										}
+									}
 								});
 							} else {
 								jt3d.layer.removeImageryProvider({
@@ -583,7 +475,16 @@
 												jt3d.layer.addWebMapTileService(_options, function(serviceId) {
 
 													//重置图层顺序
-													_self.setLayerNumber(serviceId)
+													_self.setLayerNumber(jt3d, serviceId)
+													if (atlastype === "底图") {
+														var imageryLayers = jt3d._viewer.imageryLayers;
+														imageryLayers.lowerToBottom(window[serviceId]);
+														imageryLayers.raise(window[serviceId]);
+														if (layertype === '标注') {
+															var imageryLayers = jt3d._viewer.imageryLayers;
+															imageryLayers.raiseToTop(window[serviceId]);
+														}
+													}
 												});
 
 											} else {
@@ -634,7 +535,16 @@
 										jt3d.layer.addWebMapService(_options, function(serviceId) {
 
 											//重置图层顺序
-											_self.setLayerNumber(serviceId)
+											_self.setLayerNumber(jt3d, serviceId)
+											if (atlastype === "底图") {
+												var imageryLayers = jt3d._viewer.imageryLayers;
+												imageryLayers.lowerToBottom(window[serviceId]);
+												imageryLayers.raise(window[serviceId]);
+												if (layertype === '标注') {
+													var imageryLayers = jt3d._viewer.imageryLayers;
+													imageryLayers.raiseToTop(window[serviceId]);
+												}
+											}
 										});
 									} else {
 										ElMessage("请检测图层表parameterset字段是否设置layers");
@@ -670,7 +580,16 @@
 								jt3d.layer.addArcGisMapServer(_options, function(serviceId) {
 
 									//重置图层顺序
-									_self.setLayerNumber(serviceId)
+									_self.setLayerNumber(jt3d, serviceId)
+									if (atlastype === "底图") {
+										var imageryLayers = jt3d._viewer.imageryLayers;
+										imageryLayers.lowerToBottom(window[serviceId]);
+										imageryLayers.raise(window[serviceId]);
+										if (layertype === '标注') {
+											var imageryLayers = jt3d._viewer.imageryLayers;
+											imageryLayers.raiseToTop(window[serviceId]);
+										}
+									}
 								})
 							} else {
 								jt3d.layer.removeImageryProvider({
@@ -702,7 +621,16 @@
 								jt3d.layer.addTileMapServiceImagery(_options, function(serviceId) {
 
 									//重置图层顺序
-									_self.setLayerNumber(serviceId)
+									_self.setLayerNumber(jt3d, serviceId)
+									if (atlastype === "底图") {
+										var imageryLayers = jt3d._viewer.imageryLayers;
+										imageryLayers.lowerToBottom(window[serviceId]);
+										imageryLayers.raise(window[serviceId]);
+										if (layertype === '标注') {
+											var imageryLayers = jt3d._viewer.imageryLayers;
+											imageryLayers.raiseToTop(window[serviceId]);
+										}
+									}
 								});
 							} else {
 								jt3d.layer.removeImageryProvider({
@@ -796,27 +724,188 @@
 			},
 
 			/**
+			 * 服务定位
+			 * @param {Object} data
+			 */
+			async setLayersLocation(jt3d, data) {
+				console.log('操作', '单击定位')
+				let _self = this;
+
+				let _serviceId = this.mark + "_" + data.layercode + data.layerorder;
+				let layername = data.layername;
+
+				//透明度
+				let _opacity = null;
+				if (data.opacity == null) {
+					_opacity = 1;
+				} else {
+					_opacity = Number(data.opacity);
+					data.opacity = _opacity;
+
+					if (_opacity == 0) {
+						_opacity = 1;
+					}
+				}
+
+				//参数集
+				let parameterset = data.parameterset;
+				if (data.parameterset instanceof Object) {
+					parameterset = data.parameterset;
+				} else if (data.parameterset != "" && data.parameterset != null && data.parameterset != undefined) {
+					parameterset = JSON.parse(data.parameterset);
+				}
+
+				if (data.isinit === '1') {
+					await new Promise((resolve, reject) => {
+						switch (data.loadtype) {
+							case "GeoJsonPolyline": //GeoJsonPolyline
+
+								break;
+							case "entitiesGltf": //gltf/glb
+
+								if (parameterset) {
+									if (parameterset.points) { //模型位置
+										let flyToEntity = jt3d.LocateUtil.flyToEntityByPoints([
+											parameterset.points,
+										], 'point', {
+											heading: 0,
+											pitch: -90,
+											range: 8880
+										});
+									} else {
+										ElMessage("请检测图层表parameterset字段是否设置points");
+									}
+								} else {
+									ElMessage("请检测图层表parameterset字段是否设置points");
+								}
+
+								break;
+							case "PolygonImageMaterial": //图片材质
+
+								break;
+							case "CrImageServerLayer": //地形服务（DEM）
+
+								break;
+							case "DEM": //地形服务（DEM）
+
+								break;
+							case "UrlTemplateImageryProvider": //加载URL模板服务
+
+								break;
+							case "WebMapTileServiceImageryProvider": // WMTS地图服务
+
+								break;
+							case "WebMapServiceImageryProvider": //WMS地图服务
+
+								break;
+							case "ArcGisMapServerImageryProvider": // ArcGIS Online和Server的相关服务
+
+								break;
+							case "TileMapServiceImageryProvider": // 2.5维度地图
+
+								break;
+							case "Cesium3DTileset": //加载3DTileset地图服务--实景
+
+								if (window[_serviceId]) {
+									// jt3d._viewer.flyTo(window[_serviceId], {
+									// 	offset: {
+									// 		heading: Cesium.Math.toRadians(20.0), //方向
+									// 		pitch: Cesium.Math.toRadians(-90), //倾斜角度
+									// 		range: 1000
+									// 	}
+									// });
+
+									jt3d._viewer.flyTo(window[_serviceId]);
+
+									// // 初始化参数默认值
+									// let options = {};
+									// options.heading = Cesium.defaultValue(options.heading, 5200);//方向
+									// options.pitch = Cesium.defaultValue(options.pitch, -10);//倾斜角度
+									// options.range = Cesium.defaultValue(options.range, 450.0);
+									// options.duration = Cesium.defaultValue(options.duration, 2);
+
+									// jt3d.LocateUtil.flyToTileset(window[_serviceId],options);
+
+									// jt3d.LocateUtil.zoomToTilesets(window[_serviceId], options);
+								}
+								break;
+							case "Cesium3DTileset_BM": //加载3DTileset地图服务--白膜
+
+								break;
+							default:
+								break;
+						}
+					})
+				}
+			},
+
+			/**
+			 * 设置服务透明度
+			 * @param {Object} alpha
+			 * @param {Object} data
+			 */
+			setLayersAlpha(jt3d, alpha, data) {
+				let _serviceId = this.mark + "_" + data.layercode + data.layerorder;
+				if (data.loadtype === "Cesium3DTileset") {
+					//设置实景透明度
+					jt3d.layer.set3DTileStyle({
+						serviceId: _serviceId,
+						alpha: alpha,
+					});
+				} else if (data.loadtype === "CrImageServerLayer") {
+					let floatLayer = window[_serviceId];
+					floatLayer.setOpacity(alpha)
+				} else if (data.loadtype === "PolygonImageMaterial") {
+					//设置透明度
+					jt3d.layer.setPolygonImageMaterial({
+						serviceId: _serviceId,
+						alpha: alpha,
+					});
+				} else if (data.loadtype === "entitiesGltf") {
+					//设置透明度
+					jt3d.layer.setModelStyle({
+						serviceId: _serviceId,
+						alpha: alpha,
+					});
+				} else {
+					jt3d.layer.setLayersStyle({
+						serviceId: _serviceId,
+						alpha: alpha,
+					});
+				}
+			},
+
+			/**
 			 * 设置图层顺序
 			 * @param {Object} options
 			 */
-			setLayerNumber(serviceId) {
-				var imageryLayers = window["viewer"].imageryLayers;
+			setLayerNumber(jt3d, serviceId) {
+
+				var imageryLayers = jt3d._viewer.imageryLayers;
+
+				//标注层置顶
 				if (store.markID) {
 					console.log('标注id', store.markID)
-					imageryLayers.raiseToTop(window[store.markID]); //标注层置顶
+					imageryLayers.raiseToTop(window[store.markID]);
 				}
 
-				imageryLayers.lowerToBottom(window[serviceId]); //设置图层初始顺序
+				//设置图层初始顺序
+				imageryLayers.lowerToBottom(window[serviceId]);
 				imageryLayers.raise(window[serviceId]);
 				imageryLayers.raise(window[serviceId]);
+
 				this.inittree.forEach(res => {
 					if (res.layercode && res.layerorder) {
-						let id = "service_" + res.layercode + res.layerorder
+						let id = this.mark + "_" + res.layercode + res.layerorder
 						let startid = Number(res.layercode + res.layerorder)
-						let strid = Number(serviceId.substring(8))
+						let strid = Number(serviceId.replace(this.mark + "_", ""))
+						// console.log('serviceIdNum', strid)
+
 						if (imageryLayers.contains(window[id])) {
-							if (startid < strid) {
+							if (startid <= strid) {
 								imageryLayers.raise(window[serviceId])
+								console.log('aaa', serviceId)
+
 							} else {
 								// imageryLayers.raiseToTop(window[store.markID]);
 								// break;
@@ -857,7 +946,7 @@
 						// 复选框默认选中
 						if (res.isinit === '1') {
 							_this.checkedkeys.push(res.id);
-							_this.setLayerControl(res, true);
+							_this.setLayersControl(jt3d, res, true);
 						}
 					})
 					_this.treeData = deepTree(_this.inittree)

src/views/Map3d/components/navigation.vue

@@ -0,0 +1,278 @@
+<script setup>
+
+	import jt3dNavigation from 'cesium-navigation-es6';
+
+	import {
+		inject
+	} from "vue";
+	const getMapInstance = inject("getMapInstance");
+	jt3d = getMapInstance();
+</script>
+
+<template>
+	
+</template>
+
+<script>
+	let jt3d = undefined;
+	export default {
+		props: {
+
+		},
+
+		/**
+		 * 数据
+		 */
+		data() {
+			return {
+		
+			}
+		},
+
+		/**
+		 * 方法
+		 */
+		methods: {
+			/**
+			 * 比例尺、指南针
+			 */
+			initNavigation(jt3d) {
+				let options = {};
+				// 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和 Cesium.Rectangle.
+				options.defaultResetView = Cesium.Rectangle.fromDegrees(121.13766, 36.99670, 121.94984, 37.55286);
+				// options.defaultResetView = Cesium.Cartographic.fromDegrees(103.84,31.15,24000);
+				// options.defaultResetView = Cesium.Cartographic.fromDegrees(Cesium.Math.toRadians(103.84),Cesium.Math.toRadians(31.15),Cesium.Math.toRadians(24000));
+				options.orientation = {
+					heading: Cesium.Math.toRadians(0),
+					pitch: Cesium.Math.toRadians(-90),
+					roll: 0
+				};
+			
+				//相机延时
+				options.duration = 4; //默认为3s
+			
+				// 用于启用或禁用罗盘。
+				options.enableCompass = true;
+				// 用于启用或禁用指南针外环。
+				options.enableCompassOuterRing = true;
+				// 用于启用或禁用缩放控件。
+				options.enableZoomControls = true;
+				// 用于启用或禁用距离图例。
+				options.enableDistanceLegend = false;
+			
+				//修改重置视图的tooltip
+				options.resetTooltip = "重置视图";
+				//修改放大按钮的tooltip
+				options.zoomInTooltip = "放大";
+				//修改缩小按钮的tooltip
+				options.zoomOutTooltip = "缩小";
+			
+				//如需自定义罗盘控件，请看下面的自定义罗盘控件
+				new jt3dNavigation(jt3d._viewer, options);
+			},
+
+		},
+
+		mounted() {
+			//比例尺、指南针
+			this.initNavigation(jt3d);
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	$jt3d-text-color:#fff;
+	$jt3d-content-color:#fff;
+
+	$jt3d-select-bg:red;
+
+	.query-keyword {
+		position: absolute;
+		top: 80rem;
+		width: 200rem;
+		left: 10rem;
+		border: 1rem solid rgb(0 44 126 / 100%);
+
+		.el-input {
+			--el-input-bg-color: rgb(0 44 126 / 50%);
+			--el-input-border-color: rgb(0 44 126 / 50%);
+			--el-input-placeholder-color: #fff;
+
+			--el-fill-color-blank: rgb(0 44 126 / 80%);
+			--el-text-color-regular: #fff;
+			--el-color-primary: #fff --el-border-radius-base:0rem;
+			--el-border-radius-base: 0rem;
+
+			.el-button {
+				background-color: rgb(0 44 126 / 100%);
+				color: #fff;
+			}
+		}
+
+		.autocomplete {
+			--el-fill-color-blank: rgb(0 44 126 / 0%);
+		}
+	}
+
+	.autocomplete ul {
+		font-family: sans-serif;
+		position: absolute;
+		list-style: none;
+		background: rgb(0 44 126 / 30%);
+		margin: 0;
+		width: 80%;
+		margin-top: 1rem;
+		margin-left: -1rem;
+		border: 1rem solid rgb(0 44 126 / 100%);
+	}
+
+	.autocomplete ul li {
+		text-decoration: none;
+		display: block;
+		background: rgb(0 44 126 / 30%);
+		color: #fff;
+		padding: 5rem;
+		margin-left: -40rem;
+		text-align: left;
+	}
+
+	.autocomplete ul li:hover,
+	.autocomplete ul li.focus-list {
+		color: white;
+		background: #2F9AF7;
+	}
+
+	.query-result {
+		position: absolute;
+		border-top: none;
+		padding-bottom: 0rem;
+		width: 100%;
+		z-index: 100;
+		border: 1rem solid rgb(0 44 126 / 100%);
+		background: rgb(0 44 126 / 30%);
+		margin-left: -1rem;
+
+		--el-fill-color-blank: rgb(0 44 126 / 0%);
+		--color: #fff;
+		--el-color-primary: #fff;
+
+		.query-result__item {
+			height: 80rem;
+			padding: 0 10rem;
+			display: flex;
+			justify-content: flex-start;
+			align-items: center;
+			margin-left: -40rem;
+			text-align: left;
+
+			&:hover {
+				// background-color: var(--mars-select-bg);
+			}
+
+			.query-result__context {
+				flex-grow: 1;
+				width: 90%;
+
+				.query-result-text {
+					font-size: 16rem;
+					width: 200rem;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					// color: var($jt3d-text-color);
+					color: $jt3d-text-color;
+
+					.query-result-text_num {
+						width: 20rem;
+						height: 20rem;
+						margin-right: 5rem;
+						display: inline-block;
+						text-align: center;
+						background: rgb(0 44 126 / 100%);
+					}
+				}
+
+				.query-result-sub {
+					font-size: 14rem;
+					width: 200rem;
+					margin-left: 19rem;
+					font-family: Source Han Sans CN;
+					font-weight: 400;
+					// color: var($jt3d-content-color);
+					color: $jt3d-content-color;
+				}
+			}
+
+			.query-result__more {
+				font-size: 14rem;
+				font-family: Source Han Sans CN;
+				font-weight: 400;
+				// color: var($jt3d-content-color);
+				color: $jt3d-content-color;
+			}
+		}
+
+		.query-result__page {
+			display: flex;
+			justify-content: space-between;
+			padding: 5rem;
+
+			.query-result-allcount {
+				font-size: 14rem;
+				// color: var($jt3d-text-color);
+				color: $jt3d-text-color;
+			}
+		}
+	}
+	
+	/* 四个边角样式 */
+	// .borderstyle {
+	// 	position: relative;
+	// 	width: 100%;
+	// 	height: 490rem;
+	// 	padding: 10rem;
+	// 	border: 1rem solid #008aff70 !important;
+	// 	background-color: rgba(5, 45, 115, 0.7) !important;
+	// 	box-shadow: 0 4rem 15rem 1rem #02213bb3;
+	
+
+		.angle-border {
+			position: absolute;
+			width: 12rem;
+			height: 12rem;
+		}
+	
+		.angle-border-blue {
+			position: absolute;
+			width: 70rem;
+			height: 30rem;
+		}
+	
+		.left-top-border {
+			top: -2rem;
+			left: -2rem;
+			border-left: 2rem solid #008affdd;
+			border-top: 2rem solid #008affdd;
+		}
+	
+		.right-top-border {
+			top: -2rem;
+			right: -2rem;
+			border-right: 2rem solid #008affdd;
+			border-top: 2rem solid #008affdd;
+		}
+	
+		.left-bottom-border {
+			bottom: -2rem;
+			left: -2rem;
+			border-bottom: 2rem solid #FFFFFF;
+			border-left: 2rem solid #FFFFFF;
+		}
+	
+		.right-bottom-border {
+			bottom: -2rem;
+			right: -2rem;
+			border-right: 2rem solid #FFFFFF;
+			border-bottom: 2rem solid #FFFFFF;
+		}
+	// }
+</style>

src/views/Map3d/components/query-keyword.vue

@@ -9,7 +9,6 @@
 	/**
 	 * element-plus字体
 	 */
-	import jt3dNavigation from 'cesium-navigation-es6';
 	import {
 		Search,
 		DArrowRight
@@ -95,43 +94,6 @@
 		 * 方法
 		 */
 		methods: {
-			/**
-			 * 比例尺、指南针
-			 */
-			initNavigation(jt3d) {
-				let options = {};
-				// 用于在使用重置导航重置地图视图时设置默认视图控制。接受的值是Cesium.Cartographic 和 Cesium.Rectangle.
-				options.defaultResetView = Cesium.Rectangle.fromDegrees(121.13766, 36.99670, 121.94984, 37.55286);
-				// options.defaultResetView = Cesium.Cartographic.fromDegrees(103.84,31.15,24000);
-				// options.defaultResetView = Cesium.Cartographic.fromDegrees(Cesium.Math.toRadians(103.84),Cesium.Math.toRadians(31.15),Cesium.Math.toRadians(24000));
-				options.orientation = {
-					heading: Cesium.Math.toRadians(0),
-					pitch: Cesium.Math.toRadians(-90),
-					roll: 0
-				};
-			
-				//相机延时
-				options.duration = 4; //默认为3s
-			
-				// 用于启用或禁用罗盘。
-				options.enableCompass = true;
-				// 用于启用或禁用指南针外环。
-				options.enableCompassOuterRing = true;
-				// 用于启用或禁用缩放控件。
-				options.enableZoomControls = true;
-				// 用于启用或禁用距离图例。
-				options.enableDistanceLegend = false;
-			
-				//修改重置视图的tooltip
-				options.resetTooltip = "重置视图";
-				//修改放大按钮的tooltip
-				options.zoomInTooltip = "放大";
-				//修改缩小按钮的tooltip
-				options.zoomOutTooltip = "缩小";
-			
-				//如需自定义罗盘控件，请看下面的自定义罗盘控件
-				new jt3dNavigation(jt3d._viewer, options);
-			},
 			
 			/**
 			 * 在 Input 值改变时触发
@@ -192,8 +154,6 @@
 		},
 
 		mounted() {
-			//比例尺、指南针
-			this.initNavigation(jt3d);
 			let _self = this;
 			_self.$http.get('/getTableList', {
 				tableName: 'base_sys_role',

src/views/Map3d/components/toolbars.vue

@@ -31,13 +31,13 @@
 			<span class="title">
 				测试动态线
 			</span>
-		</div>
+		</div> -->
 		<div class="toolbar-item" @click="showWidget('rotateCamera')">
 			<i class="iconfont icon-chaxunzuobiaozhi" />
 			<span class="title">
 				绕点旋转
 			</span>
-		</div> -->
+		</div>
 		<div class="toolbar-item" @click="showWidget('fullMap')">
 			<i class="iconfont icon-chaxunzuobiaozhi" />
 			<span class="title">
@@ -80,12 +80,18 @@
 					<el-dropdown-item command="analysis-terrain"><i class="iconfont icon-iconfonttubiao_dixing"></i>地形分析</el-dropdown-item>
 					<el-dropdown-item command="special-effects"><i class="iconfont icon-yu"></i>特效效果</el-dropdown-item>
 					<el-dropdown-item command="coordsTool"><i class="iconfont icon-zuobiao"></i>坐标定位</el-dropdown-item>
-					<!-- <el-dropdown-item command="TrackRoam"><i class="iconfont maxsize icon-jurassic_jiankong"></i>路径漫游</el-dropdown-item> -->
+					<el-dropdown-item command="TrackRoam"><i class="iconfont maxsize icon-jurassic_jiankong"></i>路径漫游</el-dropdown-item>
 					<el-dropdown-item command="ImageLayerSplit"><i class="iconfont maxsize icon-juanlian"></i>卷帘对比</el-dropdown-item>
 					<el-dropdown-item command="ViewerSplitScreen"><i class="iconfont minsize icon-fenping"></i>分屏对比</el-dropdown-item>
 				</el-dropdown-menu>
 			</template>
 		</el-dropdown>
+		<div class="toolbar-item" @click="showWidget('clearAll')">
+			<i class="iconfont minsize icon-shanchu"></i>
+			<span class="title">
+				清除所有
+			</span>
+		</div>
 	</div>
 </template>
 
@@ -193,7 +199,7 @@
 			showWidget: function(type) {
 				if (type === "layers") {
 					this.closePopup()
-					this.$parent.$refs.refLayer.isshow = true;
+					this.$parent.$refs.refLayerPopup.isshow = true;
 				} else if (type === "fullMap") {
 					this.$parent.$refs.refMap3d.fullMap(jt3d);
 				} else if (type === "rotateCamera") {
@@ -207,7 +213,11 @@
 				} else if (type == "viewerlabel") {
 					this.closePopup()
 					this.$parent.$refs.refviewerlabel.isshow = true
-				} else {
+				} else if (type == "clearAll") {//清除所有
+					jt3d.CommonTools.clear();
+					jt3d.DrawToolsEdit.Clear();
+					jt3d.DrawMilitaryPlot.clearAll();
+				}else {
 					this.closePopup()
 					this.$parent.showbasicLayer = true
 				}
@@ -231,7 +241,7 @@
 				this.$parent.$refs.refprintmap.isshow = false;
 				this.$parent.$refs.refDialogEdit.isshow = false;
 				this.$parent.showbasicLayer = false;
-				this.$parent.$refs.refLayer.isshow = false;
+				this.$parent.$refs.refLayerPopup.isshow = false;
 				if (this.$parent.$refs._refImageLayerSplit) {
 					this.$parent.$refs._refImageLayerSplit.removeSplitLayer(); //关闭卷帘
 				}
@@ -317,7 +327,7 @@
 				if (command === 'ViewerSplitScreen') {
 					this.closePopup();
 					this.$parent.$refs.refViewerSplitScreen.isshow = true;
-					this.$parent.$refs.refLayer.isshow = true;
+					this.$parent.$refs.refLayerPopup.isshow = true;
 					this.$parent.$refs._refViewerSplitScreen.initSplitScreen(); //开启分屏
 				}
 			},
@@ -349,9 +359,7 @@
 	.toolbars {
 		position: absolute;
 		top: 80rem;
-		width: 340rem;
-		// width: 450rem;
-		// width: 580rem;
+		width: 580rem;
 		right: 20rem;
 		cursor: pointer !important;
 		padding: 0rem !important;