- 添加SceneLabel组件,用于在对比模式下标记灾害场景 - 更新页面标题为“渝路智管-应急保通事件处置” - 修改面板标题,并添加强制调度的事件处理 - 使用条件图标增强地图标记,用于应急中心 - 更新3D模型配置URL,并在调度开始时添加加载动画 - 替换面板和工具提示的背景图片 - 添加新的图片素材,包括危险图标和加载GIF
202 lines
5.1 KiB
JavaScript
202 lines
5.1 KiB
JavaScript
/**
|
||
* 模型对比功能配置
|
||
*
|
||
* 用于配置灾前/灾后影像数据源和 3D Tiles 模型
|
||
* 支持不同环境使用不同的影像服务和 3D 模型
|
||
*/
|
||
|
||
/**
|
||
* 灾前 3D Tiles 配置
|
||
*
|
||
* 当前使用灾后模型作为占位数据(因为缺少真实的灾前模型)
|
||
* 实际部署时应替换为真实的灾前 3D Tiles 模型
|
||
*/
|
||
export const BEFORE_3DTILES_CONFIG = {
|
||
// 模型唯一标识
|
||
id: 'model-compare-before-3dtiles',
|
||
|
||
// 模型名称
|
||
name: '灾前3D模型',
|
||
|
||
// 3D Tiles 服务 URL
|
||
// TODO: 替换为实际的灾前模型 URL
|
||
url: 'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/model/S107/terra_b3dms/tileset.json',
|
||
|
||
// 默认可见性
|
||
visible: false,
|
||
|
||
// 模型说明
|
||
description: '灾害发生前的 3D 模型数据,用于对比展示灾害造成的地形变化'
|
||
}
|
||
|
||
/**
|
||
* 灾后 3D Tiles 配置
|
||
*
|
||
* 当前使用实际的灾后模型数据
|
||
*/
|
||
export const AFTER_3DTILES_CONFIG = {
|
||
// 模型唯一标识
|
||
id: 'model-compare-after-3dtiles',
|
||
|
||
// 模型名称
|
||
name: '灾后3D模型',
|
||
|
||
// 3D Tiles 服务 URL
|
||
// url: 'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/model/S107/terra_b3dms/tileset.json',
|
||
url: 'http://222.212.85.86:9000/300bdf2b-a150-406e-be63-d28bd29b409f/model/ylzg/zxyj1119/terra_b3dms/tileset.json',
|
||
|
||
|
||
// 默认可见性(初始化时灾后模型默认显示)
|
||
visible: true,
|
||
|
||
// 模型说明
|
||
description: '灾害发生后的 3D 模型数据,展示灾害现场实际情况'
|
||
}
|
||
|
||
/**
|
||
* 灾前影像配置
|
||
*
|
||
* 当前使用 OpenStreetMap 作为占位数据
|
||
* 实际部署时应替换为真实的灾前影像服务
|
||
*/
|
||
export const BEFORE_IMAGERY_CONFIG = {
|
||
// 图层唯一标识
|
||
id: 'model-compare-before',
|
||
|
||
// 图层名称
|
||
name: '灾前影像',
|
||
|
||
// 影像服务URL
|
||
// 格式:支持标准瓦片服务的URL模板,{z}/{x}/{y} 为瓦片坐标占位符
|
||
// url: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
|
||
url: 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
|
||
|
||
// 图层类型
|
||
type: 'UrlTemplate',
|
||
|
||
// 默认可见性
|
||
visible: false,
|
||
|
||
// 投影信息
|
||
projection: 'EPSG:3857', // Web Mercator
|
||
|
||
// 最大缩放级别
|
||
maximumLevel: 18,
|
||
|
||
// 图层说明
|
||
description: '灾害发生前的影像数据,用于对比展示灾害造成的变化'
|
||
}
|
||
|
||
/**
|
||
* 灾后影像配置
|
||
*
|
||
* 当前使用 Esri World Imagery 作为占位数据
|
||
* 实际部署时应替换为真实的灾后影像服务
|
||
*/
|
||
export const AFTER_IMAGERY_CONFIG = {
|
||
// 图层唯一标识
|
||
id: 'model-compare-after',
|
||
|
||
// 图层名称
|
||
name: '灾后影像',
|
||
|
||
// 影像服务URL
|
||
// Esri World Imagery 服务
|
||
url: 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
|
||
|
||
// 图层类型
|
||
type: 'UrlTemplate',
|
||
|
||
// 默认可见性(初始化时灾后影像默认显示)
|
||
visible: true,
|
||
|
||
// 投影信息
|
||
projection: 'EPSG:3857', // Web Mercator
|
||
|
||
// 最大缩放级别
|
||
maximumLevel: 19,
|
||
|
||
// 图层说明
|
||
description: '灾害发生后的影像数据,展示灾害现场实际情况'
|
||
}
|
||
|
||
/**
|
||
* 分屏配置
|
||
*/
|
||
export const SPLIT_CONFIG = {
|
||
// 默认分割位置(0-1之间,0.5表示屏幕中央)
|
||
defaultPosition: 0.5,
|
||
|
||
// 分割线最小位置(防止完全遮挡)
|
||
minPosition: 0.05,
|
||
|
||
// 分割线最大位置
|
||
maxPosition: 0.95
|
||
}
|
||
|
||
/**
|
||
* 环境特定配置
|
||
*
|
||
* 可根据不同环境(开发/测试/生产)使用不同的影像服务和 3D 模型
|
||
*/
|
||
const ENV_CONFIGS = {
|
||
// 开发环境
|
||
development: {
|
||
before: BEFORE_IMAGERY_CONFIG,
|
||
after: AFTER_IMAGERY_CONFIG,
|
||
before3DTiles: BEFORE_3DTILES_CONFIG,
|
||
after3DTiles: AFTER_3DTILES_CONFIG
|
||
},
|
||
|
||
// 生产环境(示例:使用自有服务器的影像数据和 3D 模型)
|
||
production: {
|
||
before: {
|
||
...BEFORE_IMAGERY_CONFIG,
|
||
// 生产环境可以覆盖URL
|
||
// url: 'https://your-server.com/tiles/before/{z}/{x}/{y}.png'
|
||
},
|
||
after: {
|
||
...AFTER_IMAGERY_CONFIG,
|
||
// url: 'https://your-server.com/tiles/after/{z}/{x}/{y}.png'
|
||
},
|
||
before3DTiles: {
|
||
...BEFORE_3DTILES_CONFIG,
|
||
// url: 'https://your-server.com/3dtiles/before/tileset.json'
|
||
},
|
||
after3DTiles: {
|
||
...AFTER_3DTILES_CONFIG,
|
||
// url: 'https://your-server.com/3dtiles/after/tileset.json'
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 获取当前环境的配置
|
||
*/
|
||
export function getModelCompareConfig() {
|
||
const env = import.meta.env.MODE || 'development'
|
||
return ENV_CONFIGS[env] || ENV_CONFIGS.development
|
||
}
|
||
|
||
/**
|
||
* 数据源替换指南
|
||
*
|
||
* 1. 准备影像数据:
|
||
* - 灾前影像:历史卫星影像或航拍影像
|
||
* - 灾后影像:事故发生后的实时影像
|
||
*
|
||
* 2. 发布瓦片服务:
|
||
* - 使用 GeoServer / ArcGIS Server / TileServer 等发布瓦片服务
|
||
* - 确保服务支持 CORS 跨域访问
|
||
* - 推荐使用 EPSG:3857 投影(Web Mercator)
|
||
*
|
||
* 3. 更新配置:
|
||
* - 修改上述 BEFORE_IMAGERY_CONFIG 和 AFTER_IMAGERY_CONFIG 中的 url 字段
|
||
* - 根据实际服务调整 maximumLevel 等参数
|
||
*
|
||
* 4. 性能优化:
|
||
* - 使用 CDN 加速瓦片服务
|
||
* - 预生成常用缩放级别的瓦片
|
||
* - 添加瓦片缓存机制
|
||
*/
|