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文件中使用)
# 后端本地
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' #雄哥远程

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://101.43.164.214:11111'
VITE_API_URL = 'http://jxj.zhgdyun.com:15551'
# 七参数标准版(演示平台)
# 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> = [
{
moduleName: "综合管理",
modulePath: "/projectOverview",
modulePath: "/projectOverviewer",
},
{
moduleName: "视频管理",

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

@ -7,8 +7,9 @@
</div>-->
<!-- 面板操作 -->
<div class="mars3d-box" v-if="!EntityMap.Mapswitch">
<el-button style="background: #2758c0;" @click="backhome">返回首页</el-button>
<div class="mars3d-box" v-if="!EntityMap.Mapswitch" @click="backhome">
返回首页
<!-- <el-button style="background: #2758c0;" @click="backhome">返回首页</el-button> -->
</div>
</div>
</template>
@ -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",
show: true
}
],
// 天地图标注
icon: "http://jxjzw.zhgdyun.com:6080/review/assets/png/tdt_img-49fd07fe.png",
type: "group",
layers: [
{
name: "天地图注记",
type: "tdt",
// layer: "ter_z", // 路线加点位标注
layer: "vec_z", // 只有标注
{ name: "底图", type: "tdt", layer: "img_d" },
{ name: "注记", type: "tdt", 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:
"<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>"
// 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
// const dfmY = mars3d.PointTrans.degree2dms(locationData.lat, 2).str
// 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" });
if (!EntityMap.Mapswitch) {
const compass = new mars3d.control.Compass({ bottom: "400px", 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 => {
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;

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

@ -10,7 +10,9 @@
</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>
</template>
@ -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;
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%;
}
}
}
</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 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: {