From df1161b95ab00c9ce47525f30e1b181346b84600 Mon Sep 17 00:00:00 2001
From: helloxujingliang <3225043@qq.com>
Date: Fri, 21 Feb 2025 17:05:52 +0800
Subject: [PATCH] merge
---
src/hooks/ceshiFun.hook.ts | 552 +++++++++++++++---
.../Charts/Maps/MapMars3d/index.vue | 21 +-
.../components/EventItem.vue | 201 ++++---
3 files changed, 617 insertions(+), 157 deletions(-)
diff --git a/src/hooks/ceshiFun.hook.ts b/src/hooks/ceshiFun.hook.ts
index 6fc5d2a..ab883fa 100644
--- a/src/hooks/ceshiFun.hook.ts
+++ b/src/hooks/ceshiFun.hook.ts
@@ -1,3 +1,4 @@
+import * as mars3d from "mars3d";
// 地图函数列表
export function mapFun() {
const ceshiClick = () => {
@@ -12,7 +13,203 @@ export function mapFun() {
}
- const handlerAddEntity = (data) => {
+
+ const handlerMeasureSurfaceLength = async () => {
+ const graphic = await window.measureTool.distanceSurface({
+ showAddText: true,
+ exact: false
+ })
+ }
+
+ const handlerMeasureLenth = async () => {
+
+ }
+
+ const handlerMeasureLength = async () => {
+ const graphic = await window.measureTool.distance({
+ showAddText: true,
+ label: {
+ type: "div",
+ updateText: function (text, graphic) {
+ graphic.html = `${text}
`
+ },
+ html: ``,
+ }
+ })
+ }
+
+ const handlerMeasureSurfaceArea = async () => {
+ const graphic = await window.measureTool.areaSurface({
+ style: {
+ color: "#ffff00"
+ },
+ splitNum: 10, // step插值分割的个数
+ exact: false // 是否进行精确计算， 传false时是否快速概略计算方式，该方式计算精度较低，但计算速度快，仅能计算在当前视域内坐标的高度
+ })
+ }
+
+ const handlerMeasureArea = async () => {
+ const graphic = await window.measureTool.area({
+ style: {
+ color: '#00fff2',
+ opacity: 0.4,
+ outline: true,
+ outlineColor: '#fafa5a',
+ outlineWidth: 1,
+ clampToGround: false //贴地
+ }
+ })
+ }
+
+ const handlerMeasurePoint = async () => {
+ const graphic = await window.measureTool.point({
+ popupOptions: {
+ pointerEvents: false
+ },
+ popup: function (point, event) {
+ return `位置信息
+
+
${point.lng}
+
${point.lat}
+
${point.alt}米
+
${text}
`
+ const handlerHiddenEntity = () => {
+ let data = {
+ id:10000001,
+ position:{
+ lat:35.451451,
+ lng:118.0804257,
+ },
+ image:{
+ generalIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ activeIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ },
+ attribute:{
+ label:"测试火点",
+ address:"遍历"
+ }
+
+ }
+
+ let graphic = window.graphicLayer.getGraphicById(data.id);
+ if(graphic){
+ graphic.show = false;
+ }
+ }
+
+
+ const handlerRemoveEntity = () => {
+
+ let data = {
+ id:10000001,
+ position:{
+ lat:35.451451,
+ lng:118.0804257,
+ },
+ image:{
+ generalIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ activeIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ },
+ attribute:{
+ label:"测试火点",
+ address:"遍历"
+ }
+
+ }
+
+ let graphic = window.graphicLayer.getGraphicById(data.id);
+ if(graphic){
+ graphicLayer.removeGraphic(graphic);
+ }
+ }
+
+ const handlerFlyToEntity = () => {
+
+ let data = {
+ id:10000001,
+ position:{
+ lat:35.451451,
+ lng:118.0804257,
+ },
+ image:{
+ generalIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ activeIcon:"http://221.2.83.254:9012/styleImages/image/1777249374668402688.png",
+ },
+ attribute:{
+ label:"测试火点",
+ address:"遍历"
+ }
+
+ }
+
+ let graphic = window.graphicLayer.getGraphicById(data.id);
+
+ if(graphic){
+
+ // if(data.image.activeIcon){
+ // grasphic.setStyle({
+ // image:data.image.activeIcon
+ // })
+ // }
+
+ window.globalMap.flyToGraphic(graphic);
+ }
+
+
+ }
+
+ // 清空所有适量图标
+ const handlerClearEntityLayer = () => {
+ window.graphicLayer.clear();
+ }
+
+ // 隐藏所有矢量图标
+ const handlerHiddenEntityLayer = ()=> {
+ window.graphicLayer.show = false;
+ }
+
+ const handlerShowEntityLayer = () => {
+ window.graphicLayer.show = true;
+ }
+
+ // 图层控制类
+ const handlerAddLayer = ()=>{
+ let layer = new mars3d.layer.WmsLayer({
+ "id": 4460,
+ "name": "建筑物面",
+ "type": "wms",
+ "url": "http://221.2.83.254:9007/geoserver/ksp/wms",
+ "layers": "ksp:beibushanqudaolufenlei0923",
+ "crs": "EPSG:4326",
+ "parameters": {
+ "transparent": "true",
+ "format": "image/png"
},
- html: ``,
- }
+ "highlight": {
+ "showTime": 5000,
+ "fill": true,
+ "color": "#2deaf7",
+ "opacity": 0.6,
+ "outline": true,
+ "outlineWidth": 3,
+ "outlineColor": "#e000d9",
+ "outlineOpacity": 1,
+ "clampToGround": true
+ },
+ "center": {"lat":35.376403,"lng":117.97628,"alt":3615.8,"heading":3.1,"pitch":-26.8},
+ "popup": "all",
+ "show": true,
+ "flyTo": true
})
+
+ window.globalMap.addLayer(layer);
+
}
- const handlerMeasureSurfaceArea = async () => {
- const graphic = await window.measureTool.areaSurface({
+ const handlerHiddenLayer = ()=>{
+
+ let layer = window.globalMap.getLayerById(4460);
+ if(layer){
+ layer.show = false;
+ }
+
+ }
+
+ const handlerShowLayer = ()=>{
+ let layer = window.globalMap.getLayerById(4460);
+ console.log("layer",layer);
+
+ if(layer){
+ layer.show = true;
+ }
+ }
+
+ const handlerRemoveLayer = ()=>{
+ let layer = window.globalMap.getLayerById(4460);
+
+ if(layer){
+ window.globalMap.removeLayer(layer);
+ }
+ }
+
+ const handlerFlyToLayer = ()=>{
+ let layer = window.globalMap.getLayerById(4460);
+
+ if(layer){
+ layer.flyTo();
+ }
+ }
+
+ // 三维模型
+ const handlerAddModel = ()=>{
+ // {"lat":35.4422,"lng":117.985466,"alt":2070.2,"heading":1.1,"pitch":-87.1}
+ const graphic = new mars3d.graphic.ModelEntity({
+ name:"消防车",
+ position: [117.985466, 35.4422, 11.34],
style: {
- color: "#ffff00"
+ url: "http://221.2.83.254:9010/cartoon_fire_truck/xiaofangche.gltf",
+ scale: 20,
+ minimumPixelSize: 50,
+ heading: 90,
+ distanceDisplayCondition: true,
+ distanceDisplayCondition_near: 0,
+ distanceDisplayCondition_far: 10000,
+ distanceDisplayPoint: {
+ // 当视角距离超过一定距离(distanceDisplayCondition_far定义的) 后显示为点对象的样式
+ color: "#00ff00",
+ pixelSize: 8
+ },
+ label: {
+ text: "显示信息",
+ font_size: 18,
+ color: "#ffffff",
+ pixelOffsetY: -50,
+ distanceDisplayCondition: true,
+ distanceDisplayCondition_far: 10000,
+ distanceDisplayCondition_near: 0
+ }
},
- splitNum: 10, // step插值分割的个数
- exact: false // 是否进行精确计算， 传false时是否快速概略计算方式，该方式计算精度较低，但计算速度快，仅能计算在当前视域内坐标的高度
+ attr: { remark: "示例1" }
})
+
+ window.graphicLayer.addGraphic(graphic)
}
- const handlerMeasureArea = async () => {
- const graphic = await window.measureTool.area({
- style: {
- color: '#00fff2',
- opacity: 0.4,
- outline: true,
- outlineColor: '#fafa5a',
- outlineWidth: 1,
- clampToGround: false //贴地
- }
- })
- }
-
- const handlerMeasurePoint = async () => {
- const graphic = await window.measureTool.point({
- popupOptions: {
- pointerEvents: false
- },
- popup: function (point, event) {
- return `位置信息
-
-
${point.lng}
-
${point.lat}
-
${point.alt}米
-