进行地图标绘功能的完善，彻底分离普通绘制和编辑绘制类

src/assets/fonts/fonts.css

@@ -157,4 +157,9 @@
 /* 绘制房屋图标 */
 .app-icon-draw-house::before {
 	content: '\e700';
+}
+
+/* 绘制视频墙 */
+.app-icon-draw-video::before {
+	content: '\e67b';
 }

src/components/CrMap/CommonTools.js

@@ -2,7 +2,7 @@
  * 创建者：王成
  * 操作系统：MAC
  * 创建日期：2022年11月14日
- * 描述：工具类
+ * 描述：工具类 提供绘制工具和查询工具模型
  */
 
 /* 引入Cesium */
@@ -26,11 +26,14 @@ class CommonTools {
 	constructor(viewer, options) {
 		this._viewer = viewer;
 		this._sketchViewModel = new SketchViewModel(viewer, {
-			iconType: SketchViewModel.SketchIconType.Blue,
+			iconType: SketchViewModel.SketchIconType.Green,
 			isDrawPoint: true,
 			isRetainDrawPoint: true,
 		});
 		if (options && options.isClear) this._isClear = options.isClear;
+		/* 获取画布的宽度和高度 */
+		this._canvasWidth = this._viewer.scene.canvas.width;
+		this._canvasHeight = this._viewer.scene.canvas.height;
 		/* 初始化 */
 		this._init();
 	}
@@ -67,23 +70,7 @@ class CommonTools {
 	 * @param {string} entityName 实体名称
 	 */
 	_removeEntityByName(entityName) {
-		/* 获取实体集合 */
-		let entities = this._entities;
-		/* 如果不存在实体集合或集合中没有数据 则返回 */
-		if (!entities || !entities.values) return;
-		let delEntitys = [];
-		/* 循环获取当前集合中的所有实体 */
-		for (let i = 0; i < entities.values.length; i++) {
-			if (entities.values[i].name == entityName) {
-				delEntitys.push(entities.values[i]);
-			}
-		}
-		/* 删除符合条件的所有实体 */
-		for (let i = 0; i < delEntitys.length; i++) {
-			entities.remove(delEntitys[i]);
-		}
-		/* 更新场景 */
-		this._updateScene();
+		this._sketchViewModel.removeEntityByName(entityName);
 	}
 
 	/**
@@ -157,7 +144,7 @@ class CommonTools {
 			name: _self._measureEntityName,
 			position: coord,
 			billboard: {
-				image: _self._iconBlue,
+				image: _self._iconGreen,
 				horizontalOrigin: Cesium.HorizontalOrigin.center,
 				verticalOrigin: Cesium.VerticalOrigin.bottom,
 				scale: 0.5,
@@ -182,7 +169,6 @@ class CommonTools {
 			}
 		}
 		this._entities.add(entity);
-		this._updateScene();
 		return entity;
 	}
 
@@ -215,7 +201,6 @@ class CommonTools {
 			}
 		});
 		this._entities.add(entity);
-		this._updateScene();
 	}
 
 	/**
@@ -245,7 +230,6 @@ class CommonTools {
 			}
 		});
 		this._entities.add(this._altitudeDynamicLabel);
-		this._updateScene();
 	}
 
 	/**
@@ -384,7 +368,7 @@ class CommonTools {
 	}
 
 	/**
-	 * 设置鼠标为柿子样式
+	 * 设置鼠标为十字样式
 	 */
 	_setMousePointerStyle() {
 		document.querySelector('body').style.cursor = 'crosshair';
@@ -435,8 +419,16 @@ Object.assign(CommonTools.prototype, {
 		if (text != undefined) tooltipObj.innerHTML = text;
 		/* 挂接鼠标移动事件 */
 		document.onmousemove = function(event) {
-			tooltipObj.style.left = (event.clientX + 10) + 'px';
-			tooltipObj.style.top = (event.clientY - tooltipObj.offsetHeight / 2) + 'px';
+			if (tooltipObj === null) return;
+			if (event.clientX < 100 || event.clientX > _self._canvasWidth - 100 || event.clientY <
+				100 ||
+				event.clientY > _self._canvasHeight - 100) {
+				tooltipObj.style.display = 'none';
+			} else {
+				tooltipObj.style.display = 'flex';
+				tooltipObj.style.left = (event.clientX + 10) + 'px';
+				tooltipObj.style.top = (event.clientY - tooltipObj.offsetHeight / 2) + 'px';
+			}
 		}
 	},
 
@@ -462,8 +454,9 @@ Object.assign(CommonTools.prototype, {
 	}
 })
 
+
 /**
- * 通用对外公开函数
+ * 测量类对外公开函数
  */
 Object.assign(CommonTools.prototype, {
 	/**
@@ -472,72 +465,66 @@ Object.assign(CommonTools.prototype, {
 	clear: function() {
 		/* 清理资源 */
 		this._clear(true);
-	}
-})
+	},
 
-/**
- * 测量类对外公开函数
- */
-Object.assign(CommonTools.prototype, {
 	/**
 	 * 测量长度
 	 */
 	measureLength: function() {
-		// let _self = this;
-		// /* 临时创建的实体 */
-		// this._tempEntitys = [];
-		// /* 清理资源 */
-		// this._clear(this._isClear);
-		// /* 设置鼠标样式 */
-		// this._setMousePointerStyle();
-		// /* 设置鼠标跟随 */
-		// this._tooltipInit('点击开始测量');
-		// /* 调用草图开始绘制 */
-		// this._sketchViewModel.sketchTools(SketchViewModel.SketchType.Line, {
-		// 	/**
-		// 	 * 添加点回调
-		// 	 * @param {Array<JSON>} cPoints 世界坐标系点集合
-		// 	 * @param {Array<JSON>} gPoints 球面坐标系点集合
-		// 	 */
-		// 	onAdded: function(cPoints, gPoints) {
-		// 		if (cPoints.length === 1) {
-		// 			_self._createPoint(cPoints[0], '起点');
-		// 		} else {
-		// 			let distince = _self._measureDistance(cPoints);
-		// 			/* 追加中间距离 */
-		// 			let tempPoints = [cPoints[cPoints.length - 2], cPoints[cPoints.length - 1]];
-		// 			distince += ' +' + _self._measureDistance(tempPoints);
-		// 			_self._tempEntitys.push(_self._createPoint(cPoints[cPoints.length - 1],
-		// 				distince));
-		// 		}
-		// 	},
-		// 	/**
-		// 	 * 撤销回调
-		// 	 */
-		// 	onUndo: function() {
-		// 		_self._viewer.entities.remove(_self._tempEntitys[_self._tempEntitys.length -
-		// 			1]);
-		// 		_self._tempEntitys.pop();
-		// 	},
-		// 	/**
-		// 	 * 移动回调
-		// 	 * @param {Cesium.Cartesian3} cPoint
-		// 	 * @param {JSON} scPoint 屏幕点
-		// 	 */
-		// 	onMoving: function(cPoint, scPoint) {
-		// 		_self._tooltipSetText('右键单击回退<br>左键双击结束绘制');
-		// 	},
-		// 	/**
-		// 	 * 完成回调
-		// 	 * @param {Array<JSON>} cPoints 世界坐标系点集合
-		// 	 * @param {Array<JSON>} gPoints 球面坐标系点集合
-		// 	 */
-		// 	onComplete: function(cPoints, gPoints) {
-		// 		_self._initMousePointerStyle();
-		// 		_self._tooltipRemove();
-		// 	}
-		// });
-		this._sketchViewModel.sketchCreateEditPolyline();
+		let _self = this;
+		/* 临时创建的实体 */
+		this._tempEntitys = [];
+		/* 清理资源 */
+		this._clear(this._isClear);
+		/* 设置鼠标样式 */
+		this._setMousePointerStyle();
+		/* 设置鼠标跟随 */
+		this._tooltipInit('点击开始测量');
+		/* 调用草图开始绘制 */
+		this._sketchViewModel.sketchTools(SketchViewModel.SketchType.Line, {
+			/**
+			 * 添加点回调
+			 * @param {Array<JSON>} cPoints 世界坐标系点集合
+			 * @param {Array<JSON>} gPoints 球面坐标系点集合
+			 */
+			onAdded: function(cPoints, gPoints) {
+				if (cPoints.length === 1) {
+					_self._createPoint(cPoints[0], '起点');
+				} else {
+					let distince = _self._measureDistance(cPoints);
+					/* 追加中间距离 */
+					let tempPoints = [cPoints[cPoints.length - 2], cPoints[cPoints.length - 1]];
+					distince += ' +' + _self._measureDistance(tempPoints);
+					_self._tempEntitys.push(_self._createPoint(cPoints[cPoints.length - 1],
+						distince));
+				}
+			},
+			/**
+			 * 撤销回调
+			 */
+			onUndo: function() {
+				_self._viewer.entities.remove(_self._tempEntitys[_self._tempEntitys.length -
+					1]);
+				_self._tempEntitys.pop();
+			},
+			/**
+			 * 移动回调
+			 * @param {Cesium.Cartesian3} cPoint
+			 * @param {JSON} scPoint 屏幕点
+			 */
+			onMoving: function(cPoint, scPoint) {
+				_self._tooltipSetText('右键单击回退<br>左键双击结束绘制');
+			},
+			/**
+			 * 完成回调
+			 * @param {Array<JSON>} cPoints 世界坐标系点集合
+			 * @param {Array<JSON>} gPoints 球面坐标系点集合
+			 */
+			onComplete: function(cPoints, gPoints) {
+				_self._initMousePointerStyle();
+				_self._tooltipRemove();
+			}
+		});
 	},
 
 	/**
@@ -598,7 +585,7 @@ Object.assign(CommonTools.prototype, {
 	},
 
 	/**
-	 * 测量面积
+	 * 面积测量
 	 */
 	measureArea: function() {
 		let _self = this;
@@ -660,6 +647,8 @@ Object.assign(CommonTools.prototype, {
 			onComplete: function(cPoints, gPoints) {
 				_self._initMousePointerStyle();
 				_self._tooltipRemove();
+				_self._areaLabelEntity.label.text = _self._areaLabel;
+				_self._areaLabelEntity = undefined;
 			}
 		});
 	},
@@ -1036,62 +1025,6 @@ Object.assign(CommonTools.prototype, {
  * 绘制相关
  */
 Object.assign(CommonTools.prototype, {
-	/**
-	 * 绘制面拉伸体
-	 * @param {String} callComplete 成功回调callComplete()
-	 */
-	drawPolygonBody: function(callComplete) {
-		let _self = this;
-		/* 清理资源 */
-		this._clear(this._isClear);
-		/* 设置鼠标样式 */
-		this._setMousePointerStyle();
-		/* 设置提示标签 */
-		this._tooltipInit('点击开始绘制');
-		/* 调用草图开始绘制 */
-		this._sketchViewModel.sketchTools(SketchViewModel.SketchType.PolygonBody, {
-			/**
-			 * 添加点回调
-			 * @param {Array<JSON>} cPoints 世界坐标系点集合
-			 * @param {Array<JSON>} gPoints 球面坐标系点集合
-			 */
-			onAdded: function(cPoints, gPoints) {
-				if (cPoints.length === 0) {
-					_self._tooltipInit('点击开始绘制');
-				} else if (cPoints.length < 3) {
-					_self._tooltipInit('右键单击回退');
-				} else {
-					_self._tooltipInit('右键单击回退<br>左键双击结束绘制');
-				}
-			},
-			/**
-			 * 撤销回调
-			 * @param {Array<JSON>} cPoints 世界坐标系点集合
-			 */
-			onUndo: function(cPoints) {
-				if (cPoints.length === 0) {
-					_self._tooltipInit('点击开始绘制');
-				} else if (cPoints.length < 3) {
-					_self._tooltipInit('右键单击回退');
-				} else {
-					_self._tooltipInit('右键单击回退<br>左键双击结束绘制');
-				}
-			},
-			/**
-			 * 完成回调
-			 * @param {Array<JSON>} cPoints 世界坐标系点集合
-			 * @param {Array<JSON>} gPoints 球面坐标系点集合
-			 */
-			onComplete: function(cPoints, gPoints) {
-				/* 恢复鼠标样式 */
-				_self._initMousePointerStyle();
-				/* 移除提示标签 */
-				_self._tooltipRemove();
-				/* 回调 */
-				if (callComplete) callComplete();
-			},
-		});
-	},
 
 	/**
 	 * @param {Array<Number>} points 经纬度点集合 
@@ -1159,49 +1092,5 @@ Object.assign(CommonTools.prototype, {
 	}
 });
 
-/* 其他工具 */
-Object.assign(CommonTools.prototype, {
-	/**
-	 * 拾取通过面对象拉伸绘制的体
-	 * @param {Function} callComplete 完成回调callComplete({color:height})拾取失败或者未拾取则返回undefined
-	 */
-	pickPolygonBody: function(callComplete) {
-		let _self = this;
-		this._sketchViewModel.sketchPick(function(options) {
-			if (options === undefined) {
-				if (callComplete) callComplete(undefined);
-			} else {
-				if (callComplete) callComplete({
-					color: options.color,
-					height: options.height,
-				});
-			}
-		})
-	},
-
-	/**
-	 * 设置拾取的体对象样式及高度
-	 * @@param {JSON} options 配置项 
-	 * @param {Array<Number>} options.color 颜色[0~~255,0~255,0~255,0~1] 
-	 * @param {Number} options.height 高度
-	 * @param {Function} options.onComplete(message) 完成回调,如果message为undefined则代表成功，否则为失败消息
-	 */
-	setPolygonBody: function(options) {
-		this._sketchViewModel.sketchEditPickPolygonBody({
-			color: options.color,
-			height: options.height,
-			onComplete: options.onComplete
-		})
-	},
-
-	/**
-	 * 移除拾取的体对象
-	 * @param {Function} onComplete(message) 完成回调，message为undifined为成功，否则为失败消息
-	 */
-	removePolygonBody: function(onComplete) {
-		this._sketchViewModel.sketchRemovePickPolygonBody(onComplete);
-	}
-})
-
 /* 输出 */
 export default CommonTools

src/components/CrMap/CrMap.js

@@ -635,14 +635,17 @@ Object.assign(CrMap.prototype, {
 		for (let url of options.url) {
 			let tileLayer = new Cesium.Cesium3DTileset({
 				url: url,
+				// maximumScreenSpaceError: 16,
+				// maxmumMemoryUsage: 218,
+				// skipScreenSpaceErrorFactor: 16,
+				// dynamicScreenSpaceError: true,
+				// skipLevels: 1,
+				// cullWithChildrenBounds: true,
+				// cullRequestsWhileMoving: true,
+				// cullRequestsWhileMovingMultiplier: 10, // 值越小能够更快的剔除
+				skipLevelOfDetail: true,
 				maximumScreenSpaceError: 16,
-				maxmumMemoryUsage: 218,
-				skipScreenSpaceErrorFactor: 16,
-				dynamicScreenSpaceError: true,
-				skipLevels: 1,
-				cullWithChildrenBounds: true,
-				cullRequestsWhileMoving: true,
-				cullRequestsWhileMovingMultiplier: 10, // 值越小能够更快的剔除
+				visualError: 60, //可视误差
 			});
 			let tileset = tilesets.add(tileLayer);
 			tileset.readyPromise.then(function(primitive) {

src/components/CrMap/CrMap.vue

@@ -38,7 +38,7 @@ defineExpose({
 		proxy.commonTools.measureTriangle();
 	},
 	/* 清理资源 */
-	onClear: function() {
+	onToolsClear: function() {
 		proxy.commonTools.clear();
 	},
 	/* 区域查询 */
@@ -167,6 +167,42 @@ defineExpose({
 	},
 
 	/**
+	 * 鼠标点击绘制可编辑贴地箭头线
+	 */
+	onMouseDrawEditArrowLine: function() {
+		proxy.drawTools.draw(DrawTools.DrawType.ArrowPolyline, {
+			isEdit: true
+		});
+	},
+
+	/**
+	 * 鼠标点击绘制可编辑贴地发光线
+	 */
+	onMouseDrawEditGrawLine: function() {
+		proxy.drawTools.draw(DrawTools.DrawType.GrowPolyline, {
+			isEdit: true
+		});
+	},
+
+	/**
+	 * 鼠标点击绘制可编辑贴地动态
+	 */
+	onMouseDrawEditDynamicLine: function() {
+		proxy.drawTools.draw(DrawTools.DrawType.DynamicPolyline, {
+			isEdit: true
+		});
+	},
+
+	/**
+	 * 鼠标点击绘制可编辑贴地描边线
+	 */
+	onMouseDrawEditOutlineLine: function() {
+		proxy.drawTools.draw(DrawTools.DrawType.OultliePolyline, {
+			isEdit: true
+		});
+	},
+
+	/**
 	 * 鼠标点击绘制可编辑贴地面
 	 */
 	onMouseDrawEditPolygon: function() {
@@ -239,11 +275,31 @@ defineExpose({
 	},
 
 	/**
+	 * 绘制视频墙
+	 */
+	onMouseDrawEditVideoWall: function() {
+		proxy.drawTools.draw(DrawTools.DrawType.VideoWall, {
+			isEdit: true
+		});
+	},
+
+	/**
 	 * 更新墙属性
 	 * @param {JSON} params 参数配置项
 	 */
 	onSubmitEditProperty: function(params) {
 		proxy.drawTools.updateEditEntityProperty(params);
+	},
+
+	/**
+	 * 旋转实体
+	 */
+	onRotationEntity: function() {
+		proxy.drawTools.rotationEntity({
+			x: 90,
+			y: 0,
+			z: 0
+		});
 	}
 });
 /* 初始化 */

src/components/jt-dialog/dialogEditProperty.vue

@@ -48,6 +48,18 @@
 						<div class="col-left">文字内容</div>
 						<div class="col-main"><el-input v-model="txtContent" placeholder="输入显示的文字内容" clearable type="textarea" :rows="2" /></div>
 					</div>
+					<div class="jt-wall-row" v-show="isShowMove">
+						<div class="col-left">X轴平移</div>
+						<div class="col-main"><el-input v-model="moveX" placeholder="输入1～100" clearable /></div>
+					</div>
+					<div class="jt-wall-row" v-show="isShowMove">
+						<div class="col-left">Y轴平移</div>
+						<div class="col-main"><el-input v-model="moveY" placeholder="输入1～100" clearable /></div>
+					</div>
+					<div class="jt-wall-row" v-show="isShowMove">
+						<div class="col-left">Z轴平移</div>
+						<div class="col-main"><el-input v-model="moveZ" placeholder="输入1～100" clearable /></div>
+					</div>
 					<div class="el-body-foot">
 						<el-button-group class="ml-4">
 							<el-button type="primary" :icon="Edit" @click="submit()">修改</el-button>
@@ -95,6 +107,18 @@ const props = defineProps({
 		text: {
 			type: String,
 			default: () => ''
+		},
+		moveX: {
+			type: Number,
+			default: () => 10
+		},
+		moveY: {
+			type: Number,
+			default: () => 10
+		},
+		moveZ: {
+			type: Number,
+			default: () => 10
 		}
 	},
 	showDialog: {
@@ -126,6 +150,7 @@ const isShowHeight = ref(false);
 const isShowDirection = ref(false);
 const isShowOrder = ref(false);
 const isShowCount = ref(false);
+const isShowMove = ref(true);
 const color = ref(props.params.color);
 const title = ref('属性编辑');
 const dialogVisible = ref(props.showDialog);
@@ -136,6 +161,9 @@ const radioOrder = ref('');
 const wallHeight = ref(0);
 const yCount = ref(0);
 const txtContent = ref('');
+const moveX = ref(0);
+const moveY = ref(0);
+const moveZ = ref(0);
 /* 根据传递的属性更新 */
 updateParams(props.params);
 
@@ -163,6 +191,7 @@ function updateParams(params) {
 		isShowOrder.value = false;
 		isShowCount.value = false;
 		isShowHeight.value = true;
+		isShowMove.value = false;
 	} else if (params.id === DrawTools.DrawType.DynamicWall) {
 		title.value = '动态围栏编辑';
 		isShowText.value = false;
@@ -170,6 +199,7 @@ function updateParams(params) {
 		isShowOrder.value = true;
 		isShowCount.value = true;
 		isShowHeight.value = true;
+		isShowMove.value = false;
 	} else if (params.id === DrawTools.DrawType.NormalWall) {
 		title.value = '普通围栏编辑';
 		isShowText.value = false;
@@ -177,6 +207,7 @@ function updateParams(params) {
 		isShowOrder.value = false;
 		isShowCount.value = false;
 		isShowHeight.value = true;
+		isShowMove.value = false;
 	} else if (params.id === DrawTools.DrawType.Circle) {
 		title.value = '贴地圆编辑';
 		isShowText.value = false;
@@ -184,6 +215,7 @@ function updateParams(params) {
 		isShowOrder.value = false;
 		isShowCount.value = false;
 		isShowHeight.value = false;
+		isShowMove.value = false;
 	} else if (params.id === DrawTools.DrawType.DynamicCircle) {
 		title.value = '扩散圆编辑';
 		isShowText.value = false;
@@ -198,26 +230,36 @@ function updateParams(params) {
 		isShowOrder.value = false;
 		isShowCount.value = false;
 		isShowHeight.value = true;
+		isShowMove.value = false;
+	} else if (params.id === DrawTools.DrawType.VideoWall) {
+		title.value = '视频墙编辑';
+		isShowText.value = false;
+		isShowDirection.value = false;
+		isShowOrder.value = false;
+		isShowCount.value = false;
+		isShowHeight.value = false;
+		isShowMove.value = true;
 	} else {
 		isShowText.value = false;
 		isShowDirection.value = false;
 		isShowOrder.value = false;
 		isShowCount.value = false;
 		isShowHeight.value = false;
+		isShowMove.value = false;
 	}
 	color.value = params.color;
 	/* 判断方向及顺序 */
 	if (params.direction === 'horizontal') {
 		radioDirection.value = directions[0].key;
 		Object.assign(orders, [{ key: '自左至右', value: '-' }, { key: '自右至左', value: '+' }]);
-		if (params.order === '+') {
+		if (params.order === '-') {
 			radioOrder.value = orders[0].key;
 		} else {
 			radioOrder.value = orders[1].key;
 		}
 	} else {
 		radioDirection.value = directions[1].key;
-		Object.assign(orders, [{ key: '自上至下', value: '-' }, { key: '自下至上', value: '+' }]);
+		Object.assign(orders, [{ key: '自上至下', value: '+' }, { key: '自下至上', value: '-' }]);
 		if (params.order === '+') {
 			radioOrder.value = orders[0].key;
 		} else {
@@ -227,6 +269,9 @@ function updateParams(params) {
 	wallHeight.value = params.height;
 	yCount.value = params.count;
 	txtContent.value = params.text;
+	moveX.value = params.moveX;
+	moveY.value = params.moveY;
+	moveZ.value = params.moveZ;
 }
 
 /**
@@ -251,7 +296,10 @@ function submit() {
 			return item.key === radioOrder.value;
 		})[0].value,
 		count: yCount.value,
-		text: txtContent.value
+		text: txtContent.value,
+		moveX: moveX.value,
+		moveY: moveY.value,
+		moveZ: moveZ.value
 	});
 	dialogVisible.value = false;
 }

src/demo.html

@@ -16,4 +16,12 @@
 	context.textAlign = 'left';
 	context.textBaseline = 'bottom';
 	context.fillText('我是一个立', 12, 250, 1000);
+
+	let videoElement = document.createElement("video");
+	videoElement.setAttribute("width", "1024px");
+	videoElement.setAttribute("height", "256px");
+	videoElement.setAttribute("controls", "controls");
+	videoElement.setAttribute("src", "../public/video/demo.mp4");
+	videoElement.play();
+	document.body.appendChild(videoElement);
 </script>

src/pages/tab-cmap.vue

@@ -44,7 +44,7 @@
 			</div>
 		</div>
 	</van-popup>
-	<jtDialog class="jt-tools-dialog" :showDialog="showDialog" title="地图标绘" height="550px" width="300px" @closeJTDialog="closeDialog">
+	<jtDialog class="jt-tools-dialog" :showDialog="showDialog" title="地图标绘" height="650px" width="300px" @closeJTDialog="closeDialog">
 		<el-row :gutter="20">
 			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditLine()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-line" /></el-avatar>
@@ -62,7 +62,7 @@
 		<el-row :gutter="20">
 			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditRectangle()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-rectangle" /></el-avatar>
-				<cite>矩形</cite>
+				<cite>贴地矩形</cite>
 			</el-col>
 			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditCircle()">
 				<el-avatar shape="circle" :size="50" style="background-color: azure;"><i class="app-icon app-icon-draw-circle" /></el-avatar>
@@ -81,7 +81,7 @@
 			</el-col>
 			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditText()">
 				<el-avatar shape="circle" :size="50" style="background-color: azure;"><i class="app-icon app-icon-draw-text" /></el-avatar>
-				<cite>广告牌</cite>
+				<cite>立体广告</cite>
 			</el-col>
 			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawDynamicCircle()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-circle" /></el-avatar>
@@ -93,27 +93,41 @@
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-house" /></el-avatar>
 				<cite>房屋</cite>
 			</el-col>
-			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditText()">
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditArrowLine()">
 				<el-avatar shape="circle" :size="50" style="background-color: azure;"><i class="app-icon app-icon-draw-line" /></el-avatar>
 				<cite>箭头线</cite>
 			</el-col>
-			<el-col :span="8" @click="this.$refs['cmap'].onClearDraw()">
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditDynamicLine()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-line" /></el-avatar>
 				<cite>流动线</cite>
 			</el-col>
 		</el-row>
 		<el-row :gutter="20">
-			<el-col :span="8" @click="this.$refs['cmap'].onMoouseDrawPolygonBody()">
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditGrawLine()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-line" /></el-avatar>
 				<cite>发光线</cite>
 			</el-col>
-			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditText()">
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditOutlineLine()">
 				<el-avatar shape="circle" :size="50" style="background-color: azure;"><i class="app-icon app-icon-draw-line" /></el-avatar>
 				<cite>描边线</cite>
 			</el-col>
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditVideoWall()">
+				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-video" /></el-avatar>
+				<cite>视频墙</cite>
+			</el-col>
+		</el-row>
+		<el-row :gutter="20">
+			<el-col :span="8" @click="this.$refs['cmap'].onRotationEntity()">
+				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-draw-line" /></el-avatar>
+				<cite>旋转物体</cite>
+			</el-col>
+			<el-col :span="8" @click="this.$refs['cmap'].onMouseDrawEditOutlineLine()">
+				<el-avatar shape="circle" :size="50" style="background-color: azure;"><i class="app-icon app-icon-draw-line" /></el-avatar>
+				<cite>===</cite>
+			</el-col>
 			<el-col :span="8" @click="this.$refs['cmap'].onClearDraw()">
 				<el-avatar shape="circle" :size="50" style="background-color: bisque;"><i class="app-icon app-icon-map-clean" /></el-avatar>
-				<cite>清除全部</cite>
+				<cite>清除标绘</cite>
 			</el-col>
 		</el-row>
 	</jtDialog>
@@ -162,7 +176,10 @@ export default {
 				direction: 'horizontal',
 				order: '-',
 				count: 2,
-				text: ''
+				text: '',
+				moveX: 0,
+				moveY: 0,
+				moveZ: 0
 			},
 			showEditDialog: false
 		};
@@ -201,84 +218,83 @@ export default {
 			id: 'triangle'
 		});
 		this.leftTools.push({
-			title: '绘制房屋',
-			describe: '在地图上单击绘制底部，右键结束绘制拉伸',
-			icon: 'app-icon-map-house',
-			id: 'house'
-		});
-		this.leftTools.push({
-			title: '重置地图',
-			describe: '点击即可重置地图范围为初始显示范围',
-			icon: 'app-icon-map-initlocation',
-			id: 'initMapExtent'
-		});
-		this.leftTools.push({
-			title: '坐标查询',
-			describe: '在地图上需要查询坐标的位置上点击,即可查询该位置的地理坐标',
-			icon: 'app-icon-map-querycoord',
-			id: 'coordQuery'
-		});
-		this.leftTools.push({
-			title: '坐标定位',
-			describe: '点击后,弹出坐标输入框,输入正确的位置坐标后点击定位,即可在地图上展示坐标位置',
-			icon: 'app-icon-map-inputcoord-location',
-			id: 'inputLocation'
-		});
-		this.leftTools.push({
-			title: '相机视角',
-			describe: '点击后,弹出坐标输入框,输入正确的位置坐标后点击定位,即可在地图上展示坐标位置',
-			icon: 'app-icon-map-camera-view',
-			id: 'cameraView'
-		});
-		this.leftTools.push({
-			title: '物体拾取',
-			describe: '点击后,在地图上的实体上单击，即可拾取该实体',
-			icon: 'app-icon-map-pick',
-			id: 'pick'
-		});
-
-		this.rightTools.push({
-			title: '图层管理',
-			describe: '点击即可打开图层控制窗口,进行图层及标注的显示/隐藏',
-			icon: 'app-icon-map-layer',
-			id: 'layerControl'
-		});
-		this.rightTools.push({
 			title: '点击查询',
 			describe: '点击后，在需要查询的位置单击，即可查询该位置的全部可见图层数据',
 			icon: 'app-icon-map-query-point',
 			id: 'queryByPoint'
 		});
-		this.rightTools.push({
+		this.leftTools.push({
 			title: '多点查询',
 			describe: '点击后，在需要查询的位置单击，即可查询该位置的全部可见图层数据',
 			icon: 'app-icon-map-query-multiple-point',
 			id: 'queryByMultiplePoint'
 		});
-		this.rightTools.push({
+		this.leftTools.push({
 			title: '线查询',
 			describe: '点击后，在需要查询的位置单击，即可查询该位置的全部可见图层数据',
 			icon: 'app-icon-map-query-point',
 			id: 'queryByLine'
 		});
-		this.rightTools.push({
+		this.leftTools.push({
 			title: '圆查询',
 			describe: '点击后，在需要查询的位置单击，即可查询该位置的全部可见图层数据',
 			icon: 'app-icon-map-query-point',
 			id: 'queryByCircle'
 		});
-		this.rightTools.push({
+		this.leftTools.push({
 			title: '矩形查询',
 			describe: '点击后，在需要查询的位置单击，即可查询该位置的全部可见图层数据',
 			icon: 'app-icon-map-query-point',
 			id: 'queryByRectangle'
 		});
-		this.rightTools.push({
+		this.leftTools.push({
 			title: '区域查询',
 			describe: '点击后，在地图上绘制查询区域，单击开始查询，即可查询该区域内的全部可见图层数据',
 			icon: 'app-icon-map-query-polygon',
 			id: 'queryByPolygon'
 		});
+		this.leftTools.push({
+			title: '清理绘制',
+			describe: '在地图上单击绘制底部，右键结束绘制拉伸',
+			icon: 'app-icon-map-clean',
+			id: 'toolsClear'
+		});
+		this.rightTools.push({
+			title: '图层管理',
+			describe: '点击即可打开图层控制窗口,进行图层及标注的显示/隐藏',
+			icon: 'app-icon-map-layer',
+			id: 'layerControl'
+		});
+		this.rightTools.push({
+			title: '重置地图',
+			describe: '点击即可重置地图范围为初始显示范围',
+			icon: 'app-icon-map-initlocation',
+			id: 'initMapExtent'
+		});
+		this.rightTools.push({
+			title: '坐标查询',
+			describe: '在地图上需要查询坐标的位置上点击,即可查询该位置的地理坐标',
+			icon: 'app-icon-map-querycoord',
+			id: 'coordQuery'
+		});
+		this.rightTools.push({
+			title: '坐标定位',
+			describe: '点击后,弹出坐标输入框,输入正确的位置坐标后点击定位,即可在地图上展示坐标位置',
+			icon: 'app-icon-map-inputcoord-location',
+			id: 'inputLocation'
+		});
+		this.rightTools.push({
+			title: '相机视角',
+			describe: '点击后,弹出坐标输入框,输入正确的位置坐标后点击定位,即可在地图上展示坐标位置',
+			icon: 'app-icon-map-camera-view',
+			id: 'cameraView'
+		});
+		this.rightTools.push({
+			title: '物体拾取',
+			describe: '点击后,在地图上的实体上单击，即可拾取该实体',
+			icon: 'app-icon-map-pick',
+			id: 'pick'
+		});
 		this.rightTools.push({
 			title: '清扫工具',
 			describe: '清除地图上的各类绘制内容',
@@ -310,8 +326,8 @@ export default {
 				case 'triangle':
 					_self.$refs['cmap'].onMeasureTriangle();
 					break;
-				case 'clear':
-					_self.$refs['cmap'].onClear();
+				case 'toolsClear':
+					_self.$refs['cmap'].onToolsClear();
 					break;
 				case 'queryByPolygon':
 					_self.$refs['cmap'].onQueryByPolygon();
@@ -338,9 +354,6 @@ export default {
 				case 'cameraView':
 					_self.$refs['cmap'].onGetCameraViewer();
 					break;
-				case 'house':
-					_self.$refs['cmap'].onDrawPolygonBody();
-					break;
 				case 'pick':
 					_self.$refs['cmap'].onPickPolygonBody(function(res) {
 						if (res != undefined) {
@@ -419,6 +432,9 @@ export default {
 			this.editParams.direction = param.direction;
 			this.editParams.order = param.order;
 			this.editParams.text = param.text;
+			this.editParams.moveX = param.moveX;
+			this.editParams.moveY = param.moveY;
+			this.editParams.moveZ = param.moveZ;
 			this.$refs['dialogEdit'].updateParams(this.editParams);
 		},