diff --git a/.env.development b/.env.development index d7c5a8f..7ae4fc9 100644 --- a/.env.development +++ b/.env.development @@ -3,7 +3,7 @@ NODE_ENV = 'development' # 本地环境接口地址(/api/index.ts文件中使用) # 后端本地 -VITE_API_URL = 'http://192.168.34.155:19111' +VITE_API_URL = 'http://jxj.zhgdyun.com:15551' # VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地 # VITE_API_URL = 'http://192.168.34.221:28890' #雄哥本地 # VITE_API_URL = 'http://182.90.224.237:51234' #雄哥远程 diff --git a/.env.production b/.env.production index 746bd5d..d115829 100644 --- a/.env.production +++ b/.env.production @@ -13,7 +13,7 @@ NODE_ENV = "production" # VITE_API_URL = "http://183.249.224.118:9003" # 百色 新项目通用地址 -VITE_API_URL = 'http://101.43.164.214:11111' +VITE_API_URL = 'http://jxj.zhgdyun.com:15551' # 七参数标准版(演示平台) # VITE_API_URL = 'http://jxj.zhgdyun.com:9809' diff --git a/dist.rar b/dist.rar new file mode 100644 index 0000000..f1bac0a Binary files /dev/null and b/dist.rar differ diff --git a/src/assets/images/mapimg/2024-map-1.png b/src/assets/images/mapimg/2024-map-1.png new file mode 100644 index 0000000..5f02dba Binary files /dev/null and b/src/assets/images/mapimg/2024-map-1.png differ diff --git a/src/assets/images/mapimg/2024-map-2.png b/src/assets/images/mapimg/2024-map-2.png new file mode 100644 index 0000000..5e0372d Binary files /dev/null and b/src/assets/images/mapimg/2024-map-2.png differ diff --git a/src/config/staticMenu.ts b/src/config/staticMenu.ts index d354c11..d5aa6e5 100644 --- a/src/config/staticMenu.ts +++ b/src/config/staticMenu.ts @@ -1895,7 +1895,7 @@ export const WHZTMenu: Array = [ export const ZTSYJMenu: Array = [ { moduleName: "综合管理", - modulePath: "/projectOverview", + modulePath: "/projectOverviewer", }, { moduleName: "视频管理", diff --git a/src/views/sevenLargeScreen/projectshow/components/MapBack.vue b/src/views/sevenLargeScreen/projectshow/components/MapBack.vue index 4999d21..e0add41 100644 --- a/src/views/sevenLargeScreen/projectshow/components/MapBack.vue +++ b/src/views/sevenLargeScreen/projectshow/components/MapBack.vue @@ -7,8 +7,9 @@ --> -
- 返回首页 +
+ 返回首页 +
@@ -97,76 +98,62 @@ onMounted(async () => { control: { // baseLayerPicker: true // basemaps底图切换按钮 logo: false, // 移除火星科技图标 - distanceLegend: { left: "100px", bottom: "35px" }, - zoom: true + distanceLegend: { left: "100px", bottom: "50px" }, + // zoom: true, + geocoder: { service: "8d7b8cd643454bec7737b3423647be21" }, // 使用高德POI服务 + baseLayerPicker: true, // basemaps底图切换按钮 + homeButton: true }, // terrain: { // url: "//data.mars3d.cn/terrain", // show: true // }, basemaps: [ - // { - // name: "高德地图", - // icon: "img/basemaps/gaode.png", // 假设你有一个高德地图的图标 - // type: "xyz", - // url: "http://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}", - // subdomains: ["1", "2", "3", "4"], - // show: true // 设置为默认显示 - - // // name: "高德地图 - 山地图", - // // // icon: "img/basemaps/gaode.png", // 假设你有一个高德地图的图标 - // // type: "xyz", - // // url: "http://webst0{s}.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}", - // // subdomains: ["1", "2", "3", "4"], - // // show: true // 设置为默认显示 - // } { name: "天地图影像", - icon: "img/basemaps/tdt_img.png", - // http://mars3d.cn/example/img/basemaps/tdt_img.png - type: "tdt", - layer: "img_d", + icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/tdt_img-49fd07fe.png", + type: "group", + layers: [ + { name: "底图", type: "tdt", layer: "img_d" }, + { name: "注记", type: "tdt", layer: "vec_z" } + ], show: true - } - ], - // 天地图标注 - layers: [ + }, { - name: "天地图注记", - type: "tdt", - // layer: "ter_z", // 路线加点位标注 - layer: "vec_z", // 只有标注 - show: true + name: "高德地图", + icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/offline-80b2efaa.png", // 假设你有一个高德地图的图标 + type: "xyz", + url: "http://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}", + subdomains: ["1", "2", "3", "4"] + }, + { + name: "天地图电子", + icon: "http://jxj.zhgdyun.com:100/image/670f379701fd0d65e36e1227.png", + type: "group", + layers: [ + { name: "底图", type: "tdt", layer: "vec_d" }, + { name: "注记", type: "tdt", layer: "img_z" } + ] + }, + { + name: "腾讯电子", + icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/tencent_vec-975e1cc1.png", + type: "tencent", + layer: "vec" } ] + // 天地图标注 }); - const locationBar = new mars3d.control.LocationBar({ - template: - "
经度:{lng}
纬度:{lat}
海拔：{alt}米
层级：{level}
方向：{heading}度
俯仰角：{pitch}度
视高：{cameraHeight}米
帧率：{fps} FPS
" - // template: function (locationData) { - // let pitch - // if (locationData.pitch < 0) { - // pitch = "俯视:" + -locationData.pitch - // } else { - // pitch = "仰视:" + locationData.pitch - // } + if (!EntityMap.Mapswitch) { + const compass = new mars3d.control.Compass({ bottom: "400px", left: "10px" }); + map.addControl(compass); + } - // const dfmX = mars3d.PointTrans.degree2dms(locationData.lng, 2).str - // const dfmY = mars3d.PointTrans.degree2dms(locationData.lat, 2).str - - // return `
经度:${locationData.lat} , ${dfmY}
- //
纬度:${locationData.lng} , ${dfmX}
- //
海拔：${locationData.alt}米
- //
方向：${locationData.heading}度
- //
${pitch}度
- //
视高：${locationData.cameraHeight}米
` - // } - }); - map.addControl(locationBar); - - const compass = new mars3d.control.Compass({ bottom: "180px", left: "10px" }); - map.addControl(compass); + // map.control.geocoder._czmContrl.viewModel.complete.addEventListener(function () { + // const arrdata = map.control.geocoder._czmContrl.viewModel.suggestions; + // console.log("查询结果", arrdata); + // }); // const zoom = new mars3d.control.Zoom({ bottom: "10px", left: "10px" }); // map.addControl(zoom); @@ -428,8 +415,12 @@ const getareadata = async () => { console.log("geojsonLayer", geojsonLayer); geojsonLayer.features.forEach(item => { - console.log("每块区域", item); - addDemoGraphic14(item); + if (item.geometry.type == "Polygon") { + console.log("每块区域", item); + addDemoGraphic14(item); + } else { + addCircleDemoGraphic12(item); + } }); } }); @@ -484,7 +475,8 @@ const handleNodeClick = (data: Tree) => { // 渲染数据 function addDemoGraphic2(item) { - // console.log("风机-每个", item); + console.log("风机-每个", item); + console.log("风机-每个", item.url); // 控制风机显示1-显示 0-隐藏 if (item.isShow == 1) { @@ -496,6 +488,8 @@ function addDemoGraphic2(item) { // url: "//data.mars3d.cn/gltf/mars/fengche.gltf", // url: "http://222.80.185.228:6080/image/fengji.gltf", url: item.url, + // url: "http://jxjzw.zhgdyun.com:6678/image/0D4418C6BE634CCFA93D67DD9709802B.gltf", + // url: "http://222.80.185.228:6080/image/fengji.gltf", // 选中样式 // highlight: { @@ -523,7 +517,7 @@ function addDemoGraphic2(item) { color: "#ffffff", addHeight: 9200, // pixelOffsetY: -50, - scaleByDistance: new Cesium.NearFarScalar(100, 1.0, 10000, 0.2), + scaleByDistance: new Cesium.NearFarScalar(100, 1.0, 10000, 0.2) // distanceDisplayCondition: true, // distanceDisplayCondition_far: 10000, // distanceDisplayCondition_near: 0 @@ -538,27 +532,63 @@ function addDemoGraphic2(item) { // 渲染区域 function addDemoGraphic14(item) { - // console.log("item============", item); - const graphic = new mars3d.graphic.PolylineEntity({ - positions: item.geometry.coordinates, // 假设 item.geometry.coordinates[0] 包含所有点的坐标 + console.log("item============", item); + const graphic = new mars3d.graphic.PolygonEntity({ + positions: item.geometry.coordinates, style: { - width: 1, - color: item.properties.fillColor, - closure: true, - materialType: mars3d.MaterialType.PolylineDash, // 设置材质类型为虚线 - dashLength: 20, // 虚线的长度 - dashGap: 10, // 虚线之间的间隔 + color: item.properties.collColor, // 填充颜色 + opacity: item.properties.transpitem, // 透明度 + outline: true, + outlineWidth: 2, + outlineColor: item.properties.fillColor, + outlineStyle: { + materialType: item.properties.swtichitem ? mars3d.MaterialType.PolylineDash : "" + }, // 设置边框为虚线 label: { text: item.properties.texttitle, - font_size: 13, - color: item.properties.textColor + font_size: 18, + color: item.properties.textColor, + distanceDisplayCondition: true, + distanceDisplayCondition_far: 500000, + distanceDisplayCondition_near: 0 } - }, - attr: { remark: "示例14" } + } }); graphicLayer.addGraphic(graphic); } +// 渲染区域 +function addCircleDemoGraphic12(item) { + console.log("item===圆形", item); + const graphic = new mars3d.graphic.CircleEntity({ + positions: item.geometry.coordinates, // 圆心位置 + style: { + radius: item.properties.radius, // 圆的半径 + color: item.properties.collColor, // 填充颜色 + opacity: item.properties.transpitem, // 透明度 + outline: true, + outlineStyle: { + width: 2, + materialType: item.properties.swtichitem ? mars3d.MaterialType.PolylineDash : "", + materialOptions: { + color: item.properties.fillColor // 边框颜色 + } + }, // 设置边框为虚线 + label: { + text: item.properties.texttitle, + font_size: 18, + color: item.properties.textColor, + distanceDisplayCondition: true, + distanceDisplayCondition_far: 500000, + distanceDisplayCondition_near: 0 + } + } + }); + + // 将圆形实体添加到图形图层 + graphicLayer.addGraphic(graphic); +} + // 取所有摄像头数据 const getvideolist = async () => { const res: any = await selectEnableVideoItemList({ @@ -582,9 +612,31 @@ const getvideolist = async () => { // background: red !important; position: absolute; left: 15px; /* 调整到左下角 */ - top: 800px; /* 调整到左下角 */ + top: 670px; /* 调整到左下角 */ z-index: 9999 !important; /* 确保在地图上方 */ } + + // .mars3d-locationba { + // background: red !important; + + // .mars3d-locationbar-content { + // margin-top: 10px !important; + // } + // } + + .cesium-baseLayerPicker-dropDown { + top: -242px; + right: -304px; + } + + .cesium-viewer-geocoderContainer { + position: relative; + display: inline-block; + margin: 0 3px; + position: absolute; + top: -41px; + left: -1px; + } } .mapbox { @@ -596,6 +648,18 @@ const getvideolist = async () => { top: 75px; z-index: 99999 !important; + width: 100px; + height: 30px; + cursor: pointer; + color: #ffffff; + display: flex; + justify-content: center; + align-items: center; + font-size: 14px; + + background: url("@/assets/images/mapimg/2024-map-1.png") no-repeat center center; + background-size: 100% 100%; + // width: 300px; // height: 300px; // background: #3c444f; diff --git a/src/views/sevenLargeScreen/projectshow/index.vue b/src/views/sevenLargeScreen/projectshow/index.vue index 6918f4a..2b6e4d5 100644 --- a/src/views/sevenLargeScreen/projectshow/index.vue +++ b/src/views/sevenLargeScreen/projectshow/index.vue @@ -4,13 +4,15 @@
- +
-
+
+ +
@@ -90,13 +92,26 @@ const onclosedualog = () => { // 底部 .project-but { + background: red; width: 100%; - height: 145px; + height: 100px; + padding-top: 40px; position: absolute; left: 0; - bottom: 86px; - background: url("@/assets/images/mapimg/编组.png") no-repeat center center; + bottom: 60px; + background: url("@/assets/images/mapimg/2024-map-2.png") no-repeat center center; background-size: 100% 100%; + + .projectitem { + width: 100%; + height: 120px !important; + background: skyblue; + position: absolute; + left: 0; + bottom: 0; + background: url("@/assets/images/mapimg/编组.png") no-repeat center center; + background-size: 100% 100%; + } } } diff --git a/vite.config.ts b/vite.config.ts index 2dfb6e3..a2bba5b 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -15,7 +15,7 @@ import optimizer from "vite-plugin-optimizer"; // import AutoImport from "unplugin-auto-import/vite"; // import Components from "unplugin-vue-components/vite"; // import { ElementPlusResolver } from "unplugin-vue-components/resolvers"; -// import { vitePluginMars3d } from "vite-plugin-mars3d"; +import { vitePluginMars3d } from "vite-plugin-mars3d"; // @see: https://vitejs.dev/config/ // export const BASE_IMAGE_URL = import.meta.env.NODE_ENV === "development" ? "./src" : ""; //在vite.config.ts中增加 @@ -56,7 +56,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => { // target: "https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0", // fastmock changeOrigin: true, rewrite: path => path.replace(/^\/api/, "") - } + }, } // open: true, // host: "localhost", @@ -74,7 +74,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => { }, plugins: [ vue(), - // vitePluginMars3d(), + vitePluginMars3d(), createHtmlPlugin({ inject: { data: {