浏览代码

no message

DESKTOP-CRQ4N2U\jintian 1 年之前
父节点
当前提交
88db4898b8
共有 1 个文件被更改,包括 288 次插入51 次删除
  1. 288 51
      src/components/CrMap.vue

+ 288 - 51
src/components/CrMap.vue

@@ -146,15 +146,79 @@
 			</el-button>
 			<template #dropdown>
 				<el-dropdown-menu>
-					<el-dropdown-item><Button id="straightArrow" @click="MilitaryPlotting('straightArrow')">粗单尖直线箭头</Button></el-dropdown-item>
+					<!-- <el-dropdown-item><Button id="straightArrow" @click="MilitaryPlotting('straightArrow')">粗单尖直线箭头</Button></el-dropdown-item>
 					<el-dropdown-item><Button id="attackArrow" @click="MilitaryPlotting('attackArrow')">燕尾攻击箭头</Button></el-dropdown-item>
 					<el-dropdown-item><Button id="pincerArrow" @click="MilitaryPlotting('pincerArrow')">钳击箭头</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawGatheringPlace" @click="MilitaryPlotting('drawGatheringPlace')">集结地</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawClosedCurve" @click="MilitaryPlotting('drawClosedCurve')">闭合曲面</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawSector" @click="MilitaryPlotting('drawSector')">扇形</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawCurve" @click="MilitaryPlotting('drawCurve')">曲线</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawCurveFlag" @click="MilitaryPlotting('drawCurveFlag')">曲线旗帜</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawTriangleFlag" @click="MilitaryPlotting('drawTriangleFlag')">三角旗帜</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawRectFlag" @click="MilitaryPlotting('drawRectFlag')">矩形直角旗帜</Button></el-dropdown-item>
+
+					<el-dropdown-item><Button id="drawArc" @click="MilitaryPlotting('drawArc')">弓形</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="drawLune" @click="MilitaryPlotting('drawLune')">弓形面</Button></el-dropdown-item>
+
+
 					<el-dropdown-item><Button id="clear" @click="MilitaryPlotting('clearAll')">全部删除</Button></el-dropdown-item>
 					<el-dropdown-item><Button id="clear" @click="MilitaryPlotting('clearOne')">单击删除</Button></el-dropdown-item>
 					<el-dropdown-item><Button id="save" @click="MilitaryPlotting('save')">保存</Button></el-dropdown-item>
 					<el-dropdown-item><Button id="show" @click="MilitaryPlotting('show')">展示</Button></el-dropdown-item>
 
-					<el-dropdown-item><Button id="straightArrow" @click="MilitaryPlotting('edit')">编辑</Button></el-dropdown-item>
+					<el-dropdown-item><Button id="straightArrow" @click="MilitaryPlotting('edit')">编辑</Button></el-dropdown-item> -->
+
+					<!-- <el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawPoint')">点</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawCircle')">圆</el-button>
+					</el-dropdown-item> -->
+					<!-- <el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawRectangle')">矩形</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawPolyline')">折线</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawPolygon')">多边形</el-button>
+					</el-dropdown-item> -->
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawStraightArrow')">直线箭头</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawAttackArrow')">绘制攻击箭头</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawPincerArrow')">绘制钳击箭头</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawGatheringPlace')">绘制集结地</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawClosedCurve')">绘制闭合曲面</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawArc')">绘制弓形</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawLune')">绘制弓形面</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawSector')">绘制扇形</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawCurve')">曲线</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawCurveFlag')">曲线旗帜</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawTriangleFlag')">三角旗帜</el-button>
+					</el-dropdown-item>
+					<el-dropdown-item>
+						<el-button @click="MilitaryPlotting('DrawRectFlag')">矩形直角旗帜</el-button>
+					</el-dropdown-item>
 				</el-dropdown-menu>
 			</template>
 		</el-dropdown>
@@ -207,6 +271,7 @@
 					<el-dropdown-item><Button @click="PolylineObject1()">根据坐标生成点</Button></el-dropdown-item>
 					<el-dropdown-item><Button @click="PolylineObject2()">根据坐标生成线</Button></el-dropdown-item>
 					<el-dropdown-item><Button @click="PolylineObject3()">根据坐标生成面</Button></el-dropdown-item>
+					<el-dropdown-item><Button @click="PolylineObject4()">根据坐标生成动态圆</Button></el-dropdown-item>
 				</el-dropdown-menu>
 			</template>
 		</el-dropdown>
@@ -722,10 +787,14 @@
 
 	import map_xzqh_zj from '../assets/dataFile/map_xzqh_zj.json';
 	import arrowJson from '../assets/dataFile/arrow.json';
+	// import point_zhamen from '../assets/dataFile/point_zhamen.json';
 	import point_zhamen from '../assets/dataFile/point_zhamen.json';
 
 	// import mupinglogo from '../assets/gltf/mupinglogo.glb';//这样加载失败
 
+	import fanweixian2 from '../assets/dataFile/fanweixian2.json';
+	// import fanweixian2 from 'dataFile/fanweixian2.json';
+
 	import h337 from 'heatmapjs'
 
 	let crMap = undefined;
@@ -903,6 +972,10 @@
 						title: 'GeoJsonPoint',
 						type: 'GeoJsonPoint'
 					},
+					{
+						title: 'GeoJsonWall',
+						type: 'GeoJsonWall'
+					},
 				],
 				serviceIds: {
 					DEM_id: undefined,
@@ -918,6 +991,7 @@
 					scenePrimitivesGltf_id: undefined,
 					GeoJsonPolyline_id: undefined,
 					GeoJsonPoint_id: undefined,
+					GeoJsonWall_id: undefined
 				}
 			}
 		},
@@ -1362,13 +1436,26 @@
 			//军事标绘
 			MilitaryPlotting(type) {
 
-				let param = {
-					id: type,
-					polygonColor: 'rgba(255,0,0,0.9)',
-					outlineWidth: 1,
-					outlineColor: 'rgba(0,0,0,0.9)',
-					color: 'rgba(255,0,0,0.9)',
-				};
+				// 创建标绘实例
+				crMap.DrawMilitaryPlot.onEditProperty = {}
+				crMap.DrawMilitaryPlot.drawActivate(type);
+
+				// 标绘完成返回数据
+				// Draw.DrawEndEvent.addEventListener((entity, positions, drawType) => {
+				// 	console.log({
+				// 		entity,
+				// 		positions,
+				// 		drawType
+				// 	});
+				// });
+
+				// let param = {
+				// 	id: type,
+				// 	polygonColor: 'rgba(255,0,0,0.9)',
+				// 	outlineWidth: 1,
+				// 	outlineColor: 'rgba(0,0,0,0.9)',
+				// 	color: 'rgba(255,0,0,0.9)',
+				// };
 
 				/* 创建监听 */
 				// crMap.DrawMilitaryPlot.onEditProperty = param => {
@@ -1379,35 +1466,35 @@
 				// 	alert('监听编辑')
 				// };
 
-				crMap.DrawMilitaryPlot.onEditProperty = {}
+				// crMap.DrawMilitaryPlot.onEditProperty = {}
+
+				// if (type === "clearOne") {
+				// 	crMap.DrawMilitaryPlot.clearOne();
+				// } else if (type === "clearAll") {
+				// 	crMap.DrawMilitaryPlot.clearAll();
+				// } else if (type === "save") {
+				// 	let saveData = crMap.DrawMilitaryPlot.saveData();
+				// 	saveData.then(function(jsonData) {
+				// 		console.log("保存的数据2:" + JSON.stringify(jsonData));
+				// 	})
+				// } else if (type === "show") {
+				// 	// $.getJSON(arrowJson, function(jsonData) {
+				// 	// 	debugger
+				// 	// 	crMap.DrawMilitaryPlot.showData(jsonData);
+				// 	// });
+				// 	crMap.DrawMilitaryPlot.showData(arrowJson);
 
-				if (type === "clearOne") {
-					crMap.DrawMilitaryPlot.clearOne();
-				} else if (type === "clearAll") {
-					crMap.DrawMilitaryPlot.clearAll();
-				} else if (type === "save") {
-					let saveData = crMap.DrawMilitaryPlot.saveData();
-					saveData.then(function(jsonData) {
-						console.log("保存的数据2:" + JSON.stringify(jsonData));
-					})
-				} else if (type === "show") {
-					// $.getJSON(arrowJson, function(jsonData) {
-					// 	debugger
-					// 	crMap.DrawMilitaryPlot.showData(jsonData);
-					// });
-					crMap.DrawMilitaryPlot.showData(arrowJson);
-
-				} else if (type === "edit") {
-					crMap.DrawMilitaryPlot.updateEditEntityProperty(param);
+				// } else if (type === "edit") {
+				// 	crMap.DrawMilitaryPlot.updateEditEntityProperty(param);
 
-				} else {
-					crMap.DrawMilitaryPlot.draw(type, {
-						onComplete(catesian3, Latlng) {
-							// alert('绘制完成', catesian3.length, Latlng.length)
-							// crMap.DrawMilitaryPlot.updateEditEntityProperty(param);		
-						},
-					});
-				}
+				// } else {
+				// 	crMap.DrawMilitaryPlot.draw(type, {
+				// 		onComplete(catesian3, Latlng) {
+				// 			// alert('绘制完成', catesian3.length, Latlng.length)
+				// 			// crMap.DrawMilitaryPlot.updateEditEntityProperty(param);		
+				// 		},
+				// 	});
+				// }
 			},
 
 			//地形开挖
@@ -1439,7 +1526,7 @@
 			drawGraphicsPoint(type) {
 				crMap.DrawTools.Clear();
 				crMap.DrawToolsEdit.Clear();
-				
+
 				if (type === 'clearAll') {
 					crMap.DrawPointEdit.clearAll();
 				} else {
@@ -1459,7 +1546,7 @@
 			//绘制
 			drawGraphics(type) {
 				crMap.DrawPointEdit.clearAll();
-				
+
 				let _self = this;
 				crMap.DrawTools.draw(type, {
 					onComplete(cPoint, gPoint) {
@@ -1545,7 +1632,7 @@
 
 			//根据坐标生成点
 			PolylineObject1() {
-				let point = crMap.PointObject.generatePoint(
+				let point = crMap.PointObject.addPoint(
 					[121.561965, 37.379948]
 				);
 
@@ -1710,6 +1797,37 @@
 				// 	}
 				// })
 			},
+			//根据坐标生成动态圆
+			PolylineObject4() {
+				crMap.CircleObject = new jt3d.CircleObject(crMap._viewer);
+
+				let CircleObject = crMap.CircleObject.drawCircle([121.561965, 37.379948], 100, {
+					// color: [255, 255, 0, 0.8]
+					color: [255, 0, 0, 1],
+					// outline: true,
+					// outlineColor: [255, 255, 255, 1],
+					// outlineWidth: 5,
+
+					CircleType: 'DynamicCircle',
+					count: 5,
+					duration: 3000
+				});
+				CircleObject.then(function(entity, flyEntity) {
+					debugger
+					let options = {};
+					// 初始化参数默认值
+					options.duration = Cesium.defaultValue(options.duration, 2);
+					options.heading = Cesium.defaultValue(options.heading, 0);
+					options.pitch = Cesium.defaultValue(options.pitch, -60);
+					options.range = Cesium.defaultValue(options.range, 1000);
+
+					let flyToEntity = crMap.LocateUtil.flyToEntity(entity, options);
+					flyToEntity.then(function(entity11) {
+						// alert(1111)
+					});
+				});
+
+			},
 			/**
 			 * 动态线
 			 */
@@ -2538,7 +2656,7 @@
 						// 	});
 						// });
 
-						let generatePoint = crMap.PointObject.generatePoint([121.582205, 37.307908], {
+						let generatePoint = crMap.PointObject.addPoint([121.582205, 37.307908], {
 							label: {
 								text: "aaa"
 							}
@@ -3695,9 +3813,9 @@
 							// });
 
 
-							let flyToEntity = crMap.LocateUtil.flyToEntityByPoints([
-								[116.5921405, 36.9094254, 25.64]
-							], 'point');
+							// let flyToEntity = crMap.LocateUtil.flyToEntityByPoints([
+							// 	[116.5921405, 36.9094254, 25.64]
+							// ], 'point');
 
 							// crMap.PointObject.addBillboardByGeoJson(point_zhamen, {
 							// 	id: 'GeoJsonPoint',
@@ -3719,17 +3837,48 @@
 								url: point_zhamen,
 								billboard: {
 									// imgUrl: "jt3dSDK/imgs/point/point3.png",
+									scaleByDistance: {
+										near: 1000, //相机范围的下界,非必填
+										nearValue: 1, //相机范围下界的值,非必填
+										far: 1000000, //相机范围的上限,非必填
+										farValue: 0 //该值位于摄像机范围的上界,非必填
+									}
 								},
-								label: {
-									// text: "aaa",
-									textField: "objid",
-									pixelOffset: -65, //偏移量
-									fillColor: [255, 255, 0, 1]
-								}
+								// label: {
+								// 	// text: "aaa",
+								// 	textField: "objid",
+								// 	pixelOffset: -65, //偏移量
+								// 	fillColor: [255, 255, 0, 1]
+								// }
 							}, function(serviceId) {
 								_self.serviceIds.GeoJsonPoint_id = serviceId;
 							})
 
+							// crMap.layer.addBillboardByJson({
+							// 		id: 'GeoJsonPoint',
+							// 		url: "http://218.59.194.82:12681/geoserver/sd-jnlw/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=sd-jnlw%3Aghh&outputFormat=application%2Fjson",
+							// 		billboard: {
+							// 			// imgUrl: "jt3dSDK/imgs/point/point3.png",
+							// 			scaleByDistance: {
+							// 				near: 1000, //相机范围的下界,非必填
+							// 				nearValue: 1, //相机范围下界的值,非必填
+							// 				far: 1000000, //相机范围的上限,非必填
+							// 				farValue: 0 //该值位于摄像机范围的上界,非必填
+							// 			}
+							// 		},
+							// 		// label: {
+							// 		// 	// text: "aaa",
+							// 		// 	textField: "o_name",
+							// 		// 	pixelOffset: -65, //偏移量
+							// 		// 	fillColor: [255, 255, 0, 1]
+							// 		// }
+							// 	},
+							// 	function(serviceId) {
+							// 		_self.serviceIds.GeoJsonPoint_id = serviceId;
+							// 	})
+
+
+
 
 							//添加广告牌,用于单击显示信息
 							// fetch("/dataFile/point_zhamen.json").then(res => {
@@ -3776,6 +3925,71 @@
 							});
 						}
 						break;
+					case "GeoJsonWall": //GeoJson Wall
+						if (selNode.checked) {
+
+							// crMap.WallObject.drawWallByGeoJson("http://218.59.194.82:13480/ocean_data/hyshp.json").then(res => {
+							// 	_self.serviceIds.GeoJsonWall_id = "GeoJsonWall";
+							// });
+
+							// .json文件需要放到public文件夹下,直接调用,
+							crMap.WallObject.drawWallByGeoJson("dataFile/fanweixian2.json", {
+								minimunHeights: 0,
+								maximumHeights: 1000,
+								color: [255, 255, 0, 1],
+								trailImage: 'jt3dSDK/imgs/wallmaterial/wl.png',
+								duration: 3000,
+								count: 5,
+								direction: 'vertical',
+								order: '-'
+							}).then(res => {
+								_self.serviceIds.GeoJsonWall_id = "GeoJsonWall";
+							});
+							//.json文件放到public下不能import,放到assets下import路径有问题
+							// crMap.WallObject.drawWallByGeoJson(fanweixian2).then(res => {
+							// 	_self.serviceIds.GeoJsonWall_id = "GeoJsonWall";
+							// });
+
+						} else {
+							crMap.layer.removeDataSources({
+								serviceId: _self.serviceIds.GeoJsonWall_id,
+							});
+						}
+
+
+						// // 初始化项目区域范围视角
+						// let optionsS = {
+						// 	west: 110.88459807402462,
+						// 	south: 15.598579935800508,
+						// 	east: 119.0687931142047,
+						// 	north: 21.8052784272975,
+						// 	isRemove: false, //定位完成后是否删除
+						// 	duration: 3, //飞行时间
+						// 	heading: 0,
+						// 	pitch: -90,
+						// 	range: 1052000
+						// };
+
+						// let optionsE = {
+						// 	west: 110.88459807402462,
+						// 	south: 15.598579935800508,
+						// 	east: 119.0687931142047,
+						// 	north: 21.8052784272975,
+						// 	isRemove: true, //定位完成后是否删除
+						// 	duration: 3, //飞行时间
+						// 	heading: 0,
+						// 	pitch: -60,
+						// 	range: 1052000
+						// };
+
+						// var fullMapPromise = crMap.fullMap(optionsS);
+						// fullMapPromise.then(function(flyPromise) {
+						// 	crMap.fullMap(optionsE);
+						// });
+
+						break;
+
+
 					default:
 						break;
 				}
@@ -3788,6 +4002,8 @@
 
 				crMap.DrawTools.Clear();
 				crMap.DrawToolsEdit.Clear();
+				crMap.DrawPointEdit.clearAll();
+				crMap.DrawMilitaryPlot.clearAll();
 			},
 
 			/**
@@ -4030,8 +4246,28 @@
 			});
 			crMap.DrawPointEdit = new jt3d.DrawPoint(crMap._viewer);
 
-			crMap.DrawMilitaryPlot = new jt3d.DrawMilitaryPlot(crMap._viewer);
-			// jt3d.DrawMilitaryPlot.init(crMap._viewer);
+			// crMap.DrawMilitaryPlot = new jt3d.DrawMilitaryPlot(crMap._viewer);
+
+			crMap.DrawMilitaryPlot = new jt3d.DrawMilitaryPlot({
+				viewer: crMap._viewer,
+				Cesium: Cesium,
+			});
+
+			// 创建编辑
+			// jt3d.DrawMilitaryPlot.init({
+			// 	viewer: crMap._viewer,
+			// 	Cesium: Cesium,
+			// });
+			// crMap.Enit = jt3d.DrawMilitaryPlot.editActivate();
+			// // 编辑修改实体完成返回数据
+			// crMap.Enit.EditEndEvent.addEventListener((entity) => {
+			// 	let position = entity._Position;
+			// 	let id = entity._id;
+			// 	console.log({
+			// 		position,
+			// 		id
+			// 	})
+			// })
 
 			crMap.ParticleSystem = new jt3d.SceneEffects.ParticleSystem(crMap._viewer);
 
@@ -4061,6 +4297,7 @@
 			crMap.PolylineObject = new jt3d.PolylineObject(crMap._viewer);
 			crMap.PointObject = new jt3d.PointObject(crMap._viewer);
 			crMap.PolygonObject = new jt3d.PolygonObject(crMap._viewer);
+			crMap.WallObject = new jt3d.WallObject(crMap._viewer);
 
 			window["viewer"] = crMap._viewer;