admin/zhgdlarge
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

2024-10-17 第二版本

Browse Source
This commit is contained in:
Rain 2024-10-17 17:28:00 +08:00
parent 5c5022edb9
commit 0056ca5464
9 changed files with 165 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -3,7 +3,7 @@ NODE_ENV = 'development'
# 本地环境接口地址(/api/index.ts文件中使用) # 本地环境接口地址(/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:9111' #雄哥本地
# VITE_API_URL = 'http://192.168.34.221:28890' #雄哥本地 # VITE_API_URL = 'http://192.168.34.221:28890' #雄哥本地
# VITE_API_URL = 'http://182.90.224.237:51234' #雄哥远程 # VITE_API_URL = 'http://182.90.224.237:51234' #雄哥远程

2
.env.production
View File

@ -13,7 +13,7 @@ NODE_ENV = "production"
# VITE_API_URL = "http://183.249.224.118:9003" # 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' # VITE_API_URL = 'http://jxj.zhgdyun.com:9809'

BIN
dist.rar Normal file
View File

Binary file not shown.

BIN
src/assets/images/mapimg/2024-map-1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

BIN
src/assets/images/mapimg/2024-map-2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 89 KiB

2
src/config/staticMenu.ts
View File

@ -1895,7 +1895,7 @@ export const WHZTMenu: Array<any> = [
export const ZTSYJMenu: Array<any> = [ export const ZTSYJMenu: Array<any> = [
{ {
moduleName: "综合管理", moduleName: "综合管理",
modulePath: "/projectOverview", modulePath: "/projectOverviewer",
}, },
{ {
moduleName: "视频管理", moduleName: "视频管理",

214
src/views/sevenLargeScreen/projectshow/components/MapBack.vue
View File

@ -7,8 +7,9 @@
</div>--> </div>-->
<!-- 面板操作 --> <!-- 面板操作 -->
<div class="mars3d-box" v-if="!EntityMap.Mapswitch"> <div class="mars3d-box" v-if="!EntityMap.Mapswitch" @click="backhome">
<el-button style="background: #2758c0;" @click="backhome">返回首页</el-button> 返回首页
<!-- <el-button style="background: #2758c0;" @click="backhome">返回首页</el-button> -->
</div> </div>
</div> </div>
</template> </template>
@ -97,76 +98,62 @@ onMounted(async () => {
control: { control: {
// baseLayerPicker: true // basemaps底图切换按钮 // baseLayerPicker: true // basemaps底图切换按钮
logo: false, // 移除火星科技图标 logo: false, // 移除火星科技图标
distanceLegend: { left: "100px", bottom: "35px" }, distanceLegend: { left: "100px", bottom: "50px" },
zoom: true // zoom: true,
geocoder: { service: "8d7b8cd643454bec7737b3423647be21" }, // 使用高德POI服务
baseLayerPicker: true, // basemaps底图切换按钮
homeButton: true
}, },
// terrain: { // terrain: {
// url: "//data.mars3d.cn/terrain", // url: "//data.mars3d.cn/terrain",
// show: true // show: true
// }, // },
basemaps: [ 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: "天地图影像", name: "天地图影像",
icon: "img/basemaps/tdt_img.png", icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/tdt_img-49fd07fe.png",
// http://mars3d.cn/example/img/basemaps/tdt_img.png type: "group",
type: "tdt", layers: [
layer: "img_d", { name: "底图", type: "tdt", layer: "img_d" },
{ name: "注记", type: "tdt", layer: "vec_z" }
],
show: true show: true
} },
],
// 天地图标注
layers: [
{ {
name: "天地图注记", name: "高德地图",
type: "tdt", icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/offline-80b2efaa.png", // 假设你有一个高德地图的图标
// layer: "ter_z", // 路线加点位标注 type: "xyz",
layer: "vec_z", // 只有标注 url: "http://webrd0{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
show: true 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({ if (!EntityMap.Mapswitch) {
template: const compass = new mars3d.control.Compass({ bottom: "400px", left: "10px" });
"<div>经度:{lng}</div><div>纬度:{lat}</div> <div>海拔：{alt}米</div> <div>层级：{level}</div><div>方向：{heading}度</div> <div>俯仰角：{pitch}度</div><div>视高：{cameraHeight}米</div><div>帧率：{fps} FPS</div>" map.addControl(compass);
// template: function (locationData) { }
// let pitch
// if (locationData.pitch < 0) {
// pitch = "俯视:" + -locationData.pitch
// } else {
// pitch = "仰视:" + locationData.pitch
// }
// const dfmX = mars3d.PointTrans.degree2dms(locationData.lng, 2).str // map.control.geocoder._czmContrl.viewModel.complete.addEventListener(function () {
// const dfmY = mars3d.PointTrans.degree2dms(locationData.lat, 2).str // const arrdata = map.control.geocoder._czmContrl.viewModel.suggestions;
// console.log("查询结果", arrdata);
// return ` <div>经度:${locationData.lat} , ${dfmY}</div> // });
// <div>纬度:${locationData.lng} , ${dfmX}</div>
// <div>海拔：${locationData.alt}米</div>
// <div>方向：${locationData.heading}度</div>
// <div>${pitch}度</div>
// <div>视高：${locationData.cameraHeight}米</div>`
// }
});
map.addControl(locationBar);
const compass = new mars3d.control.Compass({ bottom: "180px", left: "10px" });
map.addControl(compass);
// const zoom = new mars3d.control.Zoom({ bottom: "10px", left: "10px" }); // const zoom = new mars3d.control.Zoom({ bottom: "10px", left: "10px" });
// map.addControl(zoom); // map.addControl(zoom);
@ -428,8 +415,12 @@ const getareadata = async () => {
console.log("geojsonLayer", geojsonLayer); console.log("geojsonLayer", geojsonLayer);
geojsonLayer.features.forEach(item => { geojsonLayer.features.forEach(item => {
console.log("每块区域", item); if (item.geometry.type == "Polygon") {
addDemoGraphic14(item); console.log("每块区域", item);
addDemoGraphic14(item);
} else {
addCircleDemoGraphic12(item);
}
}); });
} }
}); });
@ -484,7 +475,8 @@ const handleNodeClick = (data: Tree) => {
// 渲染数据 // 渲染数据
function addDemoGraphic2(item) { function addDemoGraphic2(item) {
// console.log("风机-每个", item); console.log("风机-每个", item);
console.log("风机-每个", item.url);
// 控制风机显示1-显示 0-隐藏 // 控制风机显示1-显示 0-隐藏
if (item.isShow == 1) { if (item.isShow == 1) {
@ -496,6 +488,8 @@ function addDemoGraphic2(item) {
// url: "//data.mars3d.cn/gltf/mars/fengche.gltf", // url: "//data.mars3d.cn/gltf/mars/fengche.gltf",
// url: "http://222.80.185.228:6080/image/fengji.gltf", // url: "http://222.80.185.228:6080/image/fengji.gltf",
url: item.url, url: item.url,
// url: "http://jxjzw.zhgdyun.com:6678/image/0D4418C6BE634CCFA93D67DD9709802B.gltf",
// url: "http://222.80.185.228:6080/image/fengji.gltf",
// 选中样式 // 选中样式
// highlight: { // highlight: {
@ -523,7 +517,7 @@ function addDemoGraphic2(item) {
color: "#ffffff", color: "#ffffff",
addHeight: 9200, addHeight: 9200,
// pixelOffsetY: -50, // 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: true,
// distanceDisplayCondition_far: 10000, // distanceDisplayCondition_far: 10000,
// distanceDisplayCondition_near: 0 // distanceDisplayCondition_near: 0
@ -538,27 +532,63 @@ function addDemoGraphic2(item) {
// 渲染区域 // 渲染区域
function addDemoGraphic14(item) { function addDemoGraphic14(item) {
// console.log("item============", item); console.log("item============", item);
const graphic = new mars3d.graphic.PolylineEntity({ const graphic = new mars3d.graphic.PolygonEntity({
positions: item.geometry.coordinates, // 假设 item.geometry.coordinates[0] 包含所有点的坐标 positions: item.geometry.coordinates,
style: { style: {
width: 1, color: item.properties.collColor, // 填充颜色
color: item.properties.fillColor, opacity: item.properties.transpitem, // 透明度
closure: true, outline: true,
materialType: mars3d.MaterialType.PolylineDash, // 设置材质类型为虚线 outlineWidth: 2,
dashLength: 20, // 虚线的长度 outlineColor: item.properties.fillColor,
dashGap: 10, // 虚线之间的间隔 outlineStyle: {
materialType: item.properties.swtichitem ? mars3d.MaterialType.PolylineDash : ""
}, // 设置边框为虚线
label: { label: {
text: item.properties.texttitle, text: item.properties.texttitle,
font_size: 13, font_size: 18,
color: item.properties.textColor color: item.properties.textColor,
distanceDisplayCondition: true,
distanceDisplayCondition_far: 500000,
distanceDisplayCondition_near: 0
} }
}, }
attr: { remark: "示例14" }
}); });
graphicLayer.addGraphic(graphic); 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 getvideolist = async () => {
const res: any = await selectEnableVideoItemList({ const res: any = await selectEnableVideoItemList({
@ -582,9 +612,31 @@ const getvideolist = async () => {
// background: red !important; // background: red !important;
position: absolute; position: absolute;
left: 15px; /* 调整到左下角 */ left: 15px; /* 调整到左下角 */
top: 800px; /* 调整到左下角 */ top: 670px; /* 调整到左下角 */
z-index: 9999 !important; /* 确保在地图上方 */ 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 { .mapbox {
@ -596,6 +648,18 @@ const getvideolist = async () => {
top: 75px; top: 75px;
z-index: 99999 !important; 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; // width: 300px;
// height: 300px; // height: 300px;
// background: #3c444f; // background: #3c444f;

25
src/views/sevenLargeScreen/projectshow/index.vue
View File

@ -4,13 +4,15 @@
<MapBack :parentFunc="ondialogopen" :parentFuncer="onclosemapf" /> <MapBack :parentFunc="ondialogopen" :parentFuncer="onclosemapf" />
<div :class="dialogstyleswtich ? 'dialog-box' : 'dialoger-box'" v-if="dialogswtich"> <div :class="dialogstyleswtich ? 'dialog-box' : 'dialoger-box'" v-if="dialogswtich">
<!-- <div class="dialog-box" v-if="dialogswtich"> --> <!-- <div class="dialog-box" v-if="dialogswtich"> -->
<!-- <div class="dialog-box"> --> <!-- <div class="dialog-box"> -->
<MapDialog ref="MapDialogbox" :parentFunc="onclosedualog" /> <MapDialog ref="MapDialogbox" :parentFunc="onclosedualog" />
</div> </div>
<!-- 底部 --> <!-- 底部 -->
<div class="project-but" v-if="!EntityMap.Mapswitch"></div> <div class="project-but" v-if="!EntityMap.Mapswitch">
<class class="projectitem" v-if="!EntityMap.Mapswitch"></class>
</div>
</div> </div>
</template> </template>
@ -90,13 +92,26 @@ const onclosedualog = () => {
// 底部 // 底部
.project-but { .project-but {
background: red;
width: 100%; width: 100%;
height: 145px; height: 100px;
padding-top: 40px;
position: absolute; position: absolute;
left: 0; left: 0;
bottom: 86px; bottom: 60px;
background: url("@/assets/images/mapimg/编组.png") no-repeat center center; background: url("@/assets/images/mapimg/2024-map-2.png") no-repeat center center;
background-size: 100% 100%; 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%;
}
} }
} }
</style> </style>

6
vite.config.ts
View File

@ -15,7 +15,7 @@ import optimizer from "vite-plugin-optimizer";
// import AutoImport from "unplugin-auto-import/vite"; // import AutoImport from "unplugin-auto-import/vite";
// import Components from "unplugin-vue-components/vite"; // import Components from "unplugin-vue-components/vite";
// import { ElementPlusResolver } from "unplugin-vue-components/resolvers"; // import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
// import { vitePluginMars3d } from "vite-plugin-mars3d"; import { vitePluginMars3d } from "vite-plugin-mars3d";
// @see: https://vitejs.dev/config/ // @see: https://vitejs.dev/config/
// export const BASE_IMAGE_URL = import.meta.env.NODE_ENV === "development" ? "./src" : ""; // export const BASE_IMAGE_URL = import.meta.env.NODE_ENV === "development" ? "./src" : "";
//在vite.config.ts中增加 //在vite.config.ts中增加
@ -56,7 +56,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
// target: "https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0", // fastmock // target: "https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0", // fastmock
changeOrigin: true, changeOrigin: true,
rewrite: path => path.replace(/^\/api/, "") rewrite: path => path.replace(/^\/api/, "")
} },
} }
// open: true, // open: true,
// host: "localhost", // host: "localhost",
@ -74,7 +74,7 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
}, },
plugins: [ plugins: [
vue(), vue(),
// vitePluginMars3d(), vitePluginMars3d(),
createHtmlPlugin({ createHtmlPlugin({
inject: { inject: {
data: { data: {