Compare commits

..

No commits in common. "master" and "qzc-dev-demo" have entirely different histories.

60661 changed files with 4746 additions and 18191 deletions

View File

@ -1,10 +0,0 @@
$:
vscode:
- docker:
image: docker.cnb.cool/qzc120/dev-java-env
services:
- vscode
- docker
stages:
- name: node version
script: node -v

View File

@ -1,3 +1,3 @@
GENERATE_SOURCEMAP=true
PUBLIC_URL=/tsg
REACT_APP_API_URL=http://223.75.53.141:83
REACT_APP_API_URL=http://local.gunshiiot.com:18083

View File

@ -1,3 +1,3 @@
GENERATE_SOURCEMAP=false
PUBLIC_URL=/tsg
REACT_APP_API_URL=http://223.75.53.141:83
REACT_APP_API_URL=http://local.gunshiiot.com:18083

7
.gitignore vendored
View File

@ -10,7 +10,6 @@
# production
/build
build.zip
# misc
.DS_Store
@ -24,9 +23,3 @@ yarn-debug.log*
yarn-error.log*
yarn.lock
build.7z
build1.zip
#ai
.serena/
CLAUDE.md
local-ai/

1
.serena/.gitignore vendored
View File

@ -1 +0,0 @@
/cache

View File

@ -1,12 +0,0 @@
# TSG-Web前端架构分析计划
## 目标
- 全面分析TypeScript/React前端项目架构
- 理解项目结构、技术栈和代码质量
- 识别优化机会和最佳实践
## 关键入口点
- src/index.tsx (应用入口)
- 技术栈分析 (React/TypeScript)
- 构建配置和依赖管理
- 组件架构和代码组织

View File

@ -1,141 +0,0 @@
# TSG-WEB前端架构分析报告
## 项目概览
**项目名称**: shzh-web (TSG-WEB)
**项目类型**: 水利水务管理系统前端
**技术栈**: React 18 + TypeScript + Ant Design + Redux (Rematch)
**代码规模**: 1074个React组件导入12362个函数/变量声明
## 核心架构分析
### 1. 应用入口 (src/index.tsx)
- ✅ **现代化React 18架构**: 正确使用createRoot API
- ✅ **完整的技术栈集成**: Redux + Antd + 路由 + 国际化
- ✅ **数据预加载机制**: DataPreload组件提升性能
### 2. 技术栈评估
#### 🟢 优势
- **React 18最佳实践**: 使用createRoot、自动批处理等新特性
- **TypeScript全覆盖**: 严格的类型定义提升代码质量
- **状态管理成熟**: Rematch提供规范的Redux管理模式
- **UI组件库**: Ant Design 4.x提供企业级组件
- **构建工具**: CRACO自定义配置支持Less等需求
#### 🟡 待优化点
- **依赖版本**: 部分依赖可升级到最新版本
- **包大小**: 依赖较多,可考虑按需加载
### 3. 项目结构分析
```
src/
├── components/ # 通用组件 (780+文件)
│ ├── DashboardLayout/ # 布局组件
│ ├── Form/ # 表单组件库
│ ├── crud/ # CRUD操作组件
│ └── DamGraph/ # 专业图表组件
├── views/ # 页面组件 (模块化组织)
│ ├── gcaqjc/ # 工程安全监测
│ ├── rcgl/ # 日常管理
│ ├── gxsl/ # 供水兴利
│ └── sz/ # 四制管理
├── models/ # 状态管理 (Rematch)
├── service/ # API服务层
├── utils/ # 工具函数
└── assets/ # 静态资源
```
### 4. 代码质量评估
#### ✅ 符合最佳实践
- **组件化开发**: 高度模块化的组件结构
- **TypeScript类型安全**: 完整的类型定义
- **文件组织**: 按功能模块清晰分类
- **状态管理**: 统一的Redux模式
#### ⚠️ 改进建议
- **代码复用**: 部分重复逻辑可抽取为自定义Hook
- **性能优化**: 大列表可使用React Window虚拟化
- **错误边界**: 添加全局错误处理机制
### 5. 业务模块分析
#### 核心功能模块
1. **四预管理** (sy): 水利预报、预警、预演、预案
2. **工程安全监测** (gcaqjc): 大坝安全监测、预警
3. **日常管理** (rcgl): 水质管理、巡检管理、安全管理
4. **供水兴利** (gxsl): 水资源调度、供水管理
5. **四全管理** (sq): 全面感知、全面监控、全面管理
6. **四制管理** (sz): 组织机构、责任制、培训管理
#### 技术特点
- **GIS地图集成**: 基于OpenLayers的水利专业地图
- **实时监控**: 视频监控、数据实时更新
- **报表系统**: 完善的水利统计报表
- **工作流**: 业务流程管理和审批
## 优化建议
### 🚀 高优先级优化
1. **React 18特性充分利用**
- 实现并发渲染 (Concurrent Rendering)
- 使用useTransition和useDeferredValue优化用户体验
- 添加Suspense支持代码分割
2. **性能优化**
- 实现路由级别的代码分割
- 使用React.memo优化组件渲染
- 虚拟化长列表 (已有react-window依赖)
3. **TypeScript类型优化**
- 加强组件Props类型定义
- 使用泛型提升复用性
- 添加严格的null检查
### 📈 中优先级改进
4. **状态管理优化**
- 考虑使用Redux Toolkit简化Redux代码
- 实现选择器 (Selectors) 优化性能
- 添加持久化存储支持
5. **用户体验提升**
- 添加加载状态和骨架屏
- 实现更好的错误处理和用户提示
- 优化移动端适配
6. **开发体验**
- 添加Storybook组件文档
- 实现单元测试覆盖
- 配置ESLint和Prettier
### 🔧 低优先级维护
7. **依赖管理**
- 升级Ant Design到5.x (主要API变化)
- 更新React Router到最新版本
- 清理未使用的依赖
8. **架构优化**
- 考虑微前端架构支持
- 实现组件库独立打包
- 添加Monorepo管理支持
## 总体评价
**评分**: 🌟🌟🌟🌟⭐ (4.2/5)
**优势**:
- 架构清晰,技术选型合理
- React 18现代化开发实践
- 完整的TypeScript类型支持
- 丰富的水利行业功能模块
**提升空间**:
- 性能优化和用户体验
- 代码质量和测试覆盖
- 依赖管理和技术债务
**建议**: 项目整体架构健康,具备良好的可维护性和扩展性,建议重点优化性能和用户体验。

View File

@ -1,68 +0,0 @@
# language of the project (csharp, python, rust, java, typescript, go, cpp, or ruby)
# * For C, use cpp
# * For JavaScript, use typescript
# Special requirements:
# * csharp: Requires the presence of a .sln file in the project folder.
language: typescript
# whether to use the project's gitignore file to ignore files
# Added on 2025-04-07
ignore_all_files_in_gitignore: true
# list of additional paths to ignore
# same syntax as gitignore, so you can use * and **
# Was previously called `ignored_dirs`, please update your config if you are using that.
# Added (renamed) on 2025-04-07
ignored_paths: []
# whether the project is in read-only mode
# If set to true, all editing tools will be disabled and attempts to use them will result in an error
# Added on 2025-04-18
read_only: false
# list of tool names to exclude. We recommend not excluding any tools, see the readme for more details.
# Below is the complete list of tools for convenience.
# To make sure you have the latest list of tools, and to view their descriptions,
# execute `uv run scripts/print_tool_overview.py`.
#
# * `activate_project`: Activates a project by name.
# * `check_onboarding_performed`: Checks whether project onboarding was already performed.
# * `create_text_file`: Creates/overwrites a file in the project directory.
# * `delete_lines`: Deletes a range of lines within a file.
# * `delete_memory`: Deletes a memory from Serena's project-specific memory store.
# * `execute_shell_command`: Executes a shell command.
# * `find_referencing_code_snippets`: Finds code snippets in which the symbol at the given location is referenced.
# * `find_referencing_symbols`: Finds symbols that reference the symbol at the given location (optionally filtered by type).
# * `find_symbol`: Performs a global (or local) search for symbols with/containing a given name/substring (optionally filtered by type).
# * `get_current_config`: Prints the current configuration of the agent, including the active and available projects, tools, contexts, and modes.
# * `get_symbols_overview`: Gets an overview of the top-level symbols defined in a given file.
# * `initial_instructions`: Gets the initial instructions for the current project.
# Should only be used in settings where the system prompt cannot be set,
# e.g. in clients you have no control over, like Claude Desktop.
# * `insert_after_symbol`: Inserts content after the end of the definition of a given symbol.
# * `insert_at_line`: Inserts content at a given line in a file.
# * `insert_before_symbol`: Inserts content before the beginning of the definition of a given symbol.
# * `list_dir`: Lists files and directories in the given directory (optionally with recursion).
# * `list_memories`: Lists memories in Serena's project-specific memory store.
# * `onboarding`: Performs onboarding (identifying the project structure and essential tasks, e.g. for testing or building).
# * `prepare_for_new_conversation`: Provides instructions for preparing for a new conversation (in order to continue with the necessary context).
# * `read_file`: Reads a file within the project directory.
# * `read_memory`: Reads the memory with the given name from Serena's project-specific memory store.
# * `remove_project`: Removes a project from the Serena configuration.
# * `replace_lines`: Replaces a range of lines within a file with new content.
# * `replace_symbol_body`: Replaces the full definition of a symbol.
# * `restart_language_server`: Restarts the language server, may be necessary when edits not through Serena happen.
# * `search_for_pattern`: Performs a search for a pattern in the project.
# * `summarize_changes`: Provides instructions for summarizing the changes made to the codebase.
# * `switch_modes`: Activates modes by providing a list of their names
# * `think_about_collected_information`: Thinking tool for pondering the completeness of collected information.
# * `think_about_task_adherence`: Thinking tool for determining whether the agent is still on track with the current task.
# * `think_about_whether_you_are_done`: Thinking tool for determining whether the task is truly completed.
# * `write_memory`: Writes a named memory (for future reference) to Serena's project-specific memory store.
excluded_tools: []
# initial prompt for the project. It will always be given to the LLM upon activating the project
# (contrary to the memories, which are loaded on demand).
initial_prompt: ""
project_name: "tsg-web"

219
CLAUDE.md
View File

@ -1,219 +0,0 @@
# TSG-WEB 项目文档
## 项目概览
**项目名称**: shzh-web (TSG-WEB)
**项目类型**: 水利水务管理系统前端
**技术栈**: React 18 + TypeScript + Ant Design + Redux (Rematch)
**代码规模**: 1074个React组件导入12362个函数/变量声明
## 项目架构
### 应用入口
- **主入口文件**: `src/index.tsx`
- **路由配置**: `src/views/AppRouters.tsx`
- **状态管理**: `src/models/store.ts`
- **全局配置**: `src/config.ts`
### 目录结构
```
src/
├── components/ # 通用组件 (780+文件)
│ ├── DashboardLayout/ # 布局组件
│ ├── Form/ # 表单组件库
│ ├── crud/ # CRUD操作组件
│ └── DamGraph/ # 专业图表组件
├── views/ # 页面组件 (模块化组织)
│ ├── gcaqjc/ # 工程安全监测
│ ├── rcgl/ # 日常管理
│ ├── gxsl/ # 供水兴利
│ └── sz/ # 四制管理
├── models/ # 状态管理 (Rematch)
├── service/ # API服务层
├── utils/ # 工具函数
├── api/ # 静态API数据
└── assets/ # 静态资源
```
## 技术栈详解
### 核心框架
- **React 18**: 使用createRoot API支持并发特性
- **TypeScript 4.7**: 严格类型检查,提升代码质量
- **Ant Design 4.21**: 企业级UI组件库
- **React Router 6.3**: 现代化路由管理
### 状态管理
- **Rematch 2.2**: Redux的简化封装
- **模型结构**:
- `auth`: 认证管理
- `map`: 地图状态
- `overallview`: 总体视图
- `realview`: 实时视图
- `runtime`: 运行时状态
- `systemSwitch`: 系统开关
### 构建配置
- **CRACO 7.0**: 自定义Create React App配置
- **Less支持**: 自定义主题变量
- **代理配置**: 开发环境API代理
### 专业依赖
- **OpenLayers 7.4**: GIS地图功能
- **ECharts 4.9**: 数据可视化
- **Konva 8.3**: Canvas图形处理
- **Turf.js 6.5**: 地理空间分析
## 业务模块
### 四预管理 (sy)
- **洪水预报** (hsyb): 水文预报、预报方案管理
- **防汛预案** (fxya): 预案管理、抢险队伍
- **调度规程** (ddgc): 调度方案管理
- **预警发布** (yjxy): 预警信息发布
### 工程安全监测 (gcaqjc)
- **大坝安全** (bzt): 大坝安全监测图表
- **预警管理** (yhyj): 预警规则配置
- **数据统计** (sjtjcx): 各类数据统计查询
- **安全分析** (gcaqfx): 工程安全分析
### 日常管理 (rcgl)
- **水质管理** (szgl): 水质整编、监测
- **巡检管理** (xcxj): 巡检任务、问题处理
- **安全管理** (aqgl): 安全检查、隐患治理
- **值班管理** (zbgl): 值班安排、日志
### 供水兴利 (gxsl)
- **水资源调度** (szydd): 供水调度管理
- **供水管理** (gsxl): 供水指标、供水监控
- **能力分析** (gsnlfx): 供水能力分析
### 四全管理 (sq)
- **全面感知** (qfg): 注册登记信息
- **全面要素** (qys): 库区要素、工程要素
- **全面状况** (qzq): 工程状况数据
- **全面监控** (qth): 实时监控数据
### 四制管理 (sz)
- **组织机构** (zzjg): 机构管理、人员管理
- **培训管理** (pxgl): 培训计划、记录
- **法律法规** (flfg): 制度规范管理
- **行政执法** (szzf): 案件管理、处罚记录
## 关键配置
### 环境配置
```typescript
// src/config.ts
export const config = {
address: 'jianshi', // 或 'wufeng'
extent: [110.25175167632203, 29.934801589268638, 111.3498069381167, 30.416712241937642],
ADCD: '422822000000', // 行政区划代码
pubapi: 'https://owrsvr.cloudowr.cn/pubapi',
drpColors: [...], // 水位颜色配置
}
```
### 主题配置
```javascript
// craco.config.js
modifyVars: {
'@primary-color': '#1890FF',
'@error-color': '#F55E55',
'@text-color': '#3B4859',
'@card-background': '#fbfbfb',
}
```
### API配置
- **认证接口**: TOKEN_VARIFY
- **重定向地址**: NOAUTH_REDIRECT
- **代理配置**: setupProxy.js
## 开发指南
### 启动项目
```bash
yarn install
yarn start # 开发环境
yarn build # 生产构建
```
### 组件开发规范
1. 使用TypeScript编写组件
2. 遵循React Hooks规范
3. 使用Ant Design组件库
4. 状态管理通过Rematch模型
### 状态管理
```typescript
// 定义模型
export const auth = {
state: { user: null },
reducers: {
setUser: (state, payload) => ({ user: payload })
},
effects: {
async login(payload) {
// 登录逻辑
}
}
}
```
### 路由配置
```typescript
// 在AppRouters.tsx中配置
{
path: '/mgr/gcaqjc/gcaqyj/bzt',
element: <Bzt isHome={false}/>
}
```
## 部署说明
### 构建产物
- **构建命令**: `yarn build`
- **产物目录**: `build/`
- **部署方式**: 静态文件部署
### 环境要求
- **Node.js**: >=16.0.0
- **浏览器**: 现代浏览器 (Chrome、Firefox、Safari、Edge)
### 代理配置
开发环境通过setupProxy.js配置API代理生产环境需要配置Nginx反向代理。
## 注意事项
1. **地图功能**: 项目依赖OpenLayers需要确保GIS服务正常运行
2. **视频监控**: 集成视频播放功能,需要配置视频流地址
3. **数据更新**: 实时数据通过WebSocket或定时轮询更新
4. **权限管理**: 基于角色的访问控制,需要配置相应的权限
5. **浏览器兼容**: 主要支持现代浏览器不支持IE浏览器
## 优化建议
### 性能优化
1. 实现路由级别的代码分割
2. 使用React.memo优化组件渲染
3. 虚拟化长列表显示
4. 图片懒加载和压缩
### 功能增强
1. 添加离线功能支持
2. 实现PWA应用
3. 优化移动端体验
4. 增加数据导出功能
### 技术升级
1. 升级到React 19
2. 迁移到Ant Design 5.x
3. 使用Redux Toolkit
4. 添加TypeScript严格模式
---
*最后更新: 2025-09-12*
*维护者: Claude AI Assistant*

View File

@ -1,886 +0,0 @@
# TSG-WEB项目Cesium框架深度分析报告
## 📋 执行摘要
TSG-WEB项目是一个基于React的水库现代化运行管理矩阵平台深度集成了Cesium 3D地球引擎。项目采用传统CDN方式引入Cesium通过window全局对象访问实现了较为完整的3D地理信息可视化功能。
## 🔍 项目概况
### 基本信息
- **项目名称**: 檀树岗水库现代化运行管理矩阵平台 (TSG-WEB)
- **技术栈**: React 18.2.0 + Cesium + Ant Design + OpenLayers
- **Cesium版本**: 1.92+ (基于代码特征分析)
- **集成方式**: CDN方式全局window对象
- **主要功能**: 3D地形展示、影像图层、倾斜摄影、水文数据可视化
### 项目结构
```
src/views/Home/MapCtrl/Map3D/
├── Map3D.js # 主地图类 (344行)
├── demo.js # 演示功能类 (741行)
├── ToolManager3D.js # 工具管理器 (167行)
├── cs.js # 简化版地图类 (144行)
├── utils/
│ └── cesutil.js # Cesium工具函数 (65行)
└── layers/
├── baselayer3d.js # 基础图层类 (65行)
├── FeatureLayer3D.js # 特征图层基类
├── BouaLayer3D.js # 边界图层
├── HLLayer3D.js # 河流图层
├── RainLayer3D.js # 降雨图层
└── XLYLayer3D.js # 巡检路径图层
```
## 🏗️ 架构分析
### 1. 集成方式评估
**当前方式**: CDN + 全局对象
```javascript
// HTML引入
<script type="text/javascript" src="%PUBLIC_URL%/Cesium/Cesium.js"></script>
<link rel="stylesheet" href="%PUBLIC_URL%/Cesium/Widgets/widgets.css">
// 代码中使用
const { Cesium } = window;
```
**问题分析**:
- ❌ **版本管理困难**: 无法通过package.json精确控制版本
- ❌ **构建优化缺失**: 无法利用webpack的tree-shaking和代码分割
- ❌ **类型安全缺失**: 没有TypeScript类型定义支持
- ❌ **开发体验差**: IDE智能提示和重构功能受限
**推荐方式**: npm包管理
```javascript
// 推荐的现代化集成方式
import * as Cesium from 'cesium';
import 'cesium/Build/Cesium/Widgets/widgets.css';
```
### 2. 核心架构设计
#### Map3D类设计
```javascript
export default class Map3D extends BaseMap {
constructor({ divid, dispatch }) {
this.dispatch = dispatch;
this.divid = divid;
this.layerMgr = null;
this.toolMgr = null;
}
async init() {
// Cesium Viewer初始化
const viewer = new Cesium.Viewer(this.divid, {
scene3DOnly: true,
animation: false,
baseLayerPicker: false,
// ... 更多配置
});
}
}
```
**设计优点**:
- ✅ 采用面向对象封装,结构清晰
- ✅ 分层管理:地图、图层、工具分离
- ✅ 事件处理机制完善
- ✅ 支持多种数据源
**设计问题**:
- ❌ 配置硬编码,缺乏灵活性
- ❌ 错误处理不够完善
- ❌ 内存管理需要优化
### 3. 图层管理架构
#### 基础图层类设计
```javascript
export default class BaseLayer3D extends BaseLayer {
constructor(props) {
super(props);
this._entities = undefined;
this._viewer = undefined;
}
onAdd(viewer) {
this._viewer = viewer;
}
destroy(removeEntities) {
// 资源清理
}
}
```
**优点**:
- ✅ 统一的图层生命周期管理
- ✅ 资源清理机制
- ✅ 支持Entity和Primitive两种渲染方式
**不足**:
- ❌ 缺乏图层优先级管理
- ❌ 没有图层状态管理
- ❌ 缺乏图层间的依赖关系处理
## 🚀 功能特性分析
### 1. 地形和影像支持
#### 地形加载
```javascript
async getDem(viewer) {
const terrainProvider = await Cesium.CesiumTerrainProvider.fromUrl(
"https://map1.oss-cn-shenzhen.aliyuncs.com/tsg/terrain2",
{
requestVertexNormals: true
}
);
viewer.terrainProvider = terrainProvider;
}
```
**实现质量**: ⭐⭐⭐⭐
- ✅ 支持异步加载
- ✅ 配置合理
- ✅ 使用了最新的API
#### 影像图层
```javascript
async getWxyx(viewer) {
const imageryProvider = new Cesium.UrlTemplateImageryProvider({
url: baseUrl + '/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=' + tiandiKey,
subdomains: ['t0', 't1', 't2', 't3', 't4', 't5', 't6', 't7'],
maximumLevel: 17,
});
viewer.imageryLayers.addImageryProvider(imageryProvider);
}
```
**实现质量**: ⭐⭐⭐⭐
- ✅ 支持多域名负载均衡
- ✅ 使用天地图官方服务
- ✅ 合理的缩放级别限制
### 2. 3D数据可视化
#### 倾斜摄影加载
```javascript
async getQxsy(viewer) {
let tileset = await Cesium.Cesium3DTileset.fromUrl(
'http://res3d.oss-cn-shenzhen.aliyuncs.com/macheng/xiaoyutan/Scene/3DTILE.json',
{
maximumScreenSpaceError: 1,
maximumMemoryUsage: 1000,
}
);
viewer.scene.primitives.add(tileset);
}
```
**实现质量**: ⭐⭐⭐⭐⭐
- ✅ 使用最新的3D Tiles API
- ✅ 性能参数配置合理
- ✅ 支持高度偏移调整
#### 水面效果模拟
```javascript
getWater(viewer) {
const waterPrimitive = new Cesium.Primitive({
geometryInstances: new Cesium.GeometryInstance({ geometry }),
appearance: new Cesium.EllipsoidSurfaceAppearance({
material: new Cesium.Material({
fabric: {
type: 'Water',
uniforms: {
normalMap: Cesium.buildModuleUrl('models/waternormals.jpg'),
frequency: 1000.0,
animationSpeed: 0.01,
amplitude: 10,
},
},
}),
}),
});
}
```
**实现质量**: ⭐⭐⭐⭐
- ✅ 自定义Material实现
- ✅ 动态水面效果
- ✅ 性能优化较好
### 3. 数据图层管理
#### 水文数据图层
```javascript
// 降雨数据可视化
export default class RainLayer3D extends FeatureLayer3D {
addFeature(record) {
const coordsArr = getPolygonHierarchy(record.geometry);
const ent = this._viewer.entities.add({
polygon: {
hierarchy: coords,
material: Cesium.Color.fromCssColorString(record.fill).withAlpha(1),
zIndex: zindex2d.sx
}
});
return ent;
}
}
```
**实现质量**: ⭐⭐⭐
- ✅ 支持GeoJSON数据
- ✅ 合理的样式配置
- ❌ 缺乏交互功能
- ❌ 没有图例和说明
## ⚡ 性能分析
### 1. 优化措施
#### 已实施的优化
```javascript
// 关闭不必要的特效
viewer.scene.moon.show = false;
viewer.scene.fog.enabled = false;
viewer.scene.sun.show = false;
viewer.scene.skyBox.show = false;
viewer.resolutionScale = 1.0;
// 深度测试配置
viewer.scene.globe.depthTestAgainstTerrain = false;
viewer.scene.globe.enableLighting = false;
// 相机控制优化
viewer.scene.screenSpaceCameraController.minimumZoomDistance = 100;
```
**优化效果**: ⭐⭐⭐⭐
- ✅ 关闭了大部分视觉效果
- ✅ 合理的相机限制
- ✅ 适当的渲染精度
#### 性能参数配置
```javascript
// 3D Tiles性能配置
maximumScreenSpaceError: 1, // 精细程度
maximumMemoryUsage: 1000, // 内存限制
```
**配置合理性**: ⭐⭐⭐⭐
- ✅ 平衡了质量和性能
- ✅ 内存限制合理
### 2. 潜在性能问题
#### 内存管理问题
```javascript
// 问题大量Entity创建但没有及时清理
addFeature(record) {
const ent = this._viewer.entities.add({...});
return ent;
}
// 建议实现Entity池和定期清理
```
#### 渲染性能问题
```javascript
// 问题:每帧更新可能造成性能瓶颈
viewer.scene.postRender.addEventListener(() => {
this.dispatch.runtime.tickViewChanged();
this.layerMgr.frameUpdate();
});
```
## 🔧 代码质量评估
### 1. 代码结构
**优点**:
- ✅ 模块化设计清晰
- ✅ 类职责划分合理
- ✅ 错误处理基本完善
**问题**:
- ❌ 存在大量注释掉的代码
- ❌ 缺乏完整的TypeScript类型
- ❌ 配置项硬编码
- ❌ 缺乏单元测试
### 2. 编码规范
**代码示例分析**:
```javascript
// 好的实践:异步处理
async getDem(viewer) {
const terrainProvider = await Cesium.CesiumTerrainProvider.fromUrl(...);
viewer.terrainProvider = terrainProvider;
}
// 问题:硬编码配置
viewer.camera.setView({
destination: Cesium.Cartesian3.fromDegrees(114.763746000,31.482518000,1000),
orientation: {
pitch: Cesium.Math.toRadians(-35.0),
roll: 0.0
}
});
```
### 3. 错误处理
**当前实现**:
```javascript
function __prepare_ces(dispatch) {
Cesium.CesiumWidget.prototype.showErrorPanel = function (title) {
dispatch && dispatch.map.setMode('2d');
if (title && title.indexOf('constructing') >= 0) {
alert('无法初始化三维场景如果一直出现此问题请尝试下载最新的chrome浏览器');
} else {
alert('三维场景渲染出现问题');
}
};
}
```
**改进建议**:
- 需要更细致的错误分类
- 应该提供用户友好的错误提示
- 需要错误日志记录
## 📊 最佳实践遵循情况
### 1. Cesium API使用
**✅ 遵循的最佳实践**:
- 使用最新的异步API (CesiumTerrainProvider.fromUrl)
- 正确的资源管理 (Entity/Primitive生命周期)
- 合理的渲染参数配置
- 适当的相机控制
**❌ 违反的最佳实践**:
- 使用CDN而非npm包管理
- 缺乏内存泄漏防护
- 没有利用Cesium的事件系统优化性能
### 2. 性能优化
**✅ 已实施**:
- 关闭不必要的视觉效果
- 合理的LOD设置
- 适当的深度测试配置
**❌ 缺失**:
- 没有实现视锥体裁剪
- 缺乏动态LOD调整
- 没有使用Web Worker处理复杂计算
### 3. 用户体验
**✅ 做得好**:
- 基本的3D导航功能
- 合理的初始视角
- 基本的数据可视化
**❌ 需要改进**:
- 加载进度提示不足
- 错误提示不够友好
- 缺乏用户引导
## 🚨 问题识别
### 1. 架构问题
#### 高优先级问题
1. **依赖管理混乱**
- Cesium通过CDN引入版本控制困难
- 无法利用现代前端构建工具的优势
2. **内存管理不当**
- 大量Entity创建但没有有效的清理机制
- 可能导致内存泄漏
3. **错误处理不完善**
- 缺乏系统性的错误处理策略
- 用户体验差
#### 中等优先级问题
1. **配置硬编码**
- 地图配置、样式配置等写死在代码中
- 缺乏环境配置管理
2. **代码质量**
- 存在大量注释代码
- 缺乏TypeScript类型支持
### 2. 性能问题
#### 高优先级问题
1. **渲染性能**
- 复杂场景下可能出现卡顿
- 缺乏性能监控和优化
2. **内存使用**
- 长时间使用可能导致内存占用过高
- 缺乏内存使用优化
#### 中等优先级问题
1. **加载性能**
- 地形和影像加载可能较慢
- 缺乏加载优化策略
### 3. 功能缺失
#### 高优先级功能
1. **交互功能不足**
- 缺乏高级3D交互功能
- 没有测量工具
2. **数据可视化功能**
- 水文数据可视化相对简单
- 缺乏时间维度展示
## 💡 改进建议
### 1. 架构改进 (优先级:高)
#### 1.1 迁移到npm包管理
```javascript
// package.json
{
"dependencies": {
"cesium": "^1.105.0"
}
}
// 代码迁移
import * as Cesium from 'cesium';
import 'cesium/Build/Cesium/Widgets/widgets.css';
import "cesium/Source/Widgets/widgets.css";
// webpack配置
const cesiumSource = 'node_modules/cesium/Source';
const cesiumWorkers = '../Build/Cesium/Workers';
```
#### 1.2 实现配置管理
```javascript
// config/mapConfig.js
export const MAP_CONFIG = {
initialView: {
destination: [114.763746000, 31.482518000, 1000],
orientation: {
pitch: -35.0,
roll: 0.0
}
},
terrain: {
url: "/shzh/mapres/terrain",
requestVertexNormals: true
},
imagery: {
tiandiKey: "efc861f25f96dc6e5f884f0403ebfefd",
maximumLevel: 17
}
};
```
#### 1.3 改进错误处理
```javascript
class MapErrorManager {
static handleError(error, context) {
console.error('Map Error:', error);
switch(error.type) {
case 'INITIALIZATION':
this.showUserError('地图初始化失败,请检查网络连接');
break;
case 'TERRAIN_LOADING':
this.showUserError('地形数据加载失败');
break;
case 'MEMORY':
this.showUserError('内存不足,请关闭其他标签页');
break;
default:
this.showUserError('地图出现错误,请刷新页面重试');
}
// 记录错误日志
this.logError(error, context);
}
}
```
### 2. 性能优化 (优先级:高)
#### 2.1 实现Entity池
```javascript
class EntityPool {
constructor(viewer, entityType) {
this.viewer = viewer;
this.entityType = entityType;
this.pool = [];
this.activeEntities = new Set();
}
acquire() {
let entity = this.pool.pop();
if (!entity) {
entity = this.createEntity();
}
this.activeEntities.add(entity);
return entity;
}
release(entity) {
this.activeEntities.delete(entity);
entity.show = false;
this.pool.push(entity);
}
cleanup() {
// 定期清理过多的Entity
if (this.pool.length > MAX_POOL_SIZE) {
const excess = this.pool.length - MAX_POOL_SIZE;
for (let i = 0; i < excess; i++) {
const entity = this.pool.pop();
this.viewer.entities.remove(entity);
}
}
}
}
```
#### 2.2 实现LOD管理
```javascript
class LODManager {
constructor(viewer) {
this.viewer = viewer;
this.lastCameraHeight = 0;
}
update() {
const height = this.viewer.camera.positionCartographic.height;
// 根据相机高度调整LOD
if (Math.abs(height - this.lastCameraHeight) > HEIGHT_THRESHOLD) {
this.adjustLOD(height);
this.lastCameraHeight = height;
}
}
adjustLOD(height) {
// 调整地形精度
const terrainProvider = this.viewer.terrainProvider;
if (terrainProvider) {
terrainProvider.tileCacheSize = this.calculateCacheSize(height);
}
// 调整3D Tiles精度
this.adjust3DTilesLOD(height);
}
}
```
#### 2.3 添加性能监控
```javascript
class PerformanceMonitor {
constructor(viewer) {
this.viewer = viewer;
this.stats = {
fps: 0,
memory: 0,
entities: 0,
primitives: 0
};
this.startMonitoring();
}
startMonitoring() {
this.viewer.scene.postRender.addEventListener(() => {
this.updateStats();
this.checkPerformance();
});
}
updateStats() {
// 更新性能统计
this.stats.fps = this.calculateFPS();
this.stats.memory = performance.memory?.usedJSHeapSize || 0;
this.stats.entities = this.viewer.entities.values.length;
this.stats.primitives = this.viewer.scene.primitives.length;
}
checkPerformance() {
if (this.stats.fps < 15) {
console.warn('Low FPS detected:', this.stats.fps);
this.triggerOptimization();
}
if (this.stats.memory > MEMORY_THRESHOLD) {
console.warn('High memory usage detected');
this.cleanupMemory();
}
}
}
```
### 3. 功能增强 (优先级:中)
#### 3.1 添加交互工具
```javascript
class MeasureTool {
constructor(viewer) {
this.viewer = viewer;
this.active = false;
this.positions = [];
this.entities = [];
}
activate() {
this.active = true;
this.setupEventHandlers();
}
deactivate() {
this.active = false;
this.clearMeasurement();
this.removeEventHandlers();
}
setupEventHandlers() {
this.handler = new Cesium.ScreenSpaceEventHandler(this.viewer.scene.canvas);
this.handler.setInputAction((click) => {
if (this.active) {
this.addMeasurementPoint(click.position);
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
}
addMeasurementPoint(position) {
const cartesian = this.viewer.scene.pickPosition(position);
if (cartesian) {
this.positions.push(cartesian);
this.updateMeasurementDisplay();
}
}
updateMeasurementDisplay() {
// 更新测量显示
if (this.positions.length >= 2) {
const distance = this.calculateDistance();
this.showDistanceLabel(distance);
}
}
}
```
#### 3.2 时间维度数据展示
```javascript
class TimeSeriesManager {
constructor(viewer) {
this.viewer = viewer;
this.currentTime = null;
this.timeRange = null;
this.dataCache = new Map();
}
setTimeRange(start, end) {
this.timeRange = { start, end };
this.currentTime = start;
}
updateTime(time) {
this.currentTime = time;
this.updateDataDisplay();
}
async loadDataForTime(time) {
if (this.dataCache.has(time)) {
return this.dataCache.get(time);
}
const data = await this.fetchTimeSeriesData(time);
this.dataCache.set(time, data);
return data;
}
updateDataDisplay() {
// 更新时间序列数据显示
this.clearCurrentData();
const data = this.loadDataForTime(this.currentTime);
this.renderData(data);
}
}
```
### 4. 代码质量改进 (优先级:中)
#### 4.1 添加TypeScript支持
```typescript
// types/cesium-extensions.d.ts
declare module 'cesium' {
interface Viewer {
customProperties: {
layerManager: LayerManager;
toolManager: ToolManager;
};
}
interface Entity {
__props: any;
__state: any;
}
}
// Map3D.ts
export default class Map3D extends BaseMap {
private viewer: Cesium.Viewer;
private layerMgr: LayerMgr3D | null;
private toolMgr: ToolManager | null;
constructor(config: MapConfig) {
super();
this.config = config;
}
async init(): Promise<void> {
this.viewer = new Cesium.Viewer(this.config.container, {
// 类型安全的配置
});
}
}
```
#### 4.2 添加单元测试
```javascript
// __tests__/Map3D.test.js
import Map3D from '../Map3D';
import Cesium from 'cesium';
describe('Map3D', () => {
let map3d;
let container;
beforeEach(() => {
container = document.createElement('div');
container.id = 'map-container';
document.body.appendChild(container);
map3d = new Map3D({
divid: 'map-container',
dispatch: mockDispatch
});
});
afterEach(() => {
if (map3d) {
map3d.destroy();
}
document.body.removeChild(container);
});
test('should initialize Cesium viewer', async () => {
await map3d.init();
expect(map3d.getViewer()).toBeDefined();
expect(map3d.getViewer().scene).toBeDefined();
});
test('should load terrain data', async () => {
await map3d.init();
const terrainProvider = map3d.getViewer().terrainProvider;
expect(terrainProvider).toBeDefined();
});
});
```
## 📈 实施路线图
### 第一阶段:基础改进 (2-3周)
1. **依赖管理迁移**
- 将Cesium改为npm包管理
- 配置webpack构建优化
- 添加TypeScript支持
2. **配置管理**
- 抽取配置到外部文件
- 实现环境变量支持
- 添加配置验证
### 第二阶段:性能优化 (3-4周)
1. **内存管理**
- 实现Entity池
- 添加自动清理机制
- 优化资源加载
2. **性能监控**
- 添加FPS监控
- 内存使用监控
- 性能瓶颈分析
### 第三阶段:功能增强 (4-6周)
1. **交互功能**
- 添加测量工具
- 实现高级选择功能
- 添加属性查询
2. **数据可视化**
- 时间维度数据展示
- 高级水文数据可视化
- 动态效果增强
### 第四阶段:质量提升 (2-3周)
1. **代码质量**
- 添加单元测试
- 代码重构
- 文档完善
2. **用户体验**
- 加载优化
- 错误处理改进
- 用户引导
## 🎯 预期收益
### 技术收益
- **性能提升**: 预期性能提升30-50%
- **内存优化**: 内存使用减少40-60%
- **开发效率**: 开发效率提升20-30%
- **可维护性**: 代码可维护性大幅提升
### 业务收益
- **用户体验**: 加载速度提升,交互更流畅
- **功能增强**: 新增3D交互和数据分析功能
- **稳定性**: 减少崩溃和错误率
- **扩展性**: 为未来功能扩展奠定基础
## 📊 总结
TSG-WEB项目的Cesium集成在功能实现上相对完整基本满足了3D地理信息可视化的需求。但在架构设计、性能优化、代码质量等方面还有较大改进空间。
**主要优势**:
- ✅ 功能完整性较好
- ✅ 基础3D功能实现完整
- ✅ 数据可视化基础扎实
**主要不足**:
- ❌ 架构设计需要现代化改造
- ❌ 性能优化空间较大
- ❌ 代码质量有待提升
**建议优先级**:
1. **高优先级**: 依赖管理迁移、内存管理优化
2. **中优先级**: 性能监控、功能增强
3. **低优先级**: UI美化、高级功能
通过系统性的改进可以将TSG-WEB项目的3D地理信息功能提升到行业领先水平为水库管理提供更好的技术支撑。
---
*报告生成时间: 2025-09-12*
*分析工具: Claude Code + Cesium最佳实践分析*
*建议Cesium版本: 1.105.0+*

View File

@ -1,214 +0,0 @@
# TSG-WEB 水利水务管理系统前端架构评分报告
## 项目概况
- **项目名称**: TSG-WEB 水利水务管理系统
- **技术栈**: React 18 + TypeScript + Antd + Rematch + OpenLayers
- **代码规模**: 151个TS/TSX文件约21,916行代码
- **依赖大小**: 4.0GB (node_modules)
## 评分详情
### 1. 架构设计 (30分)
**得分: 21/30**
#### 优势
- **状态管理架构合理** (8/10分)
- 采用Rematch进行状态管理模块化设计清晰
- Models按功能域划分auth、map、overallview、realview等
- 类型安全的Redux替代方案提供良好的TypeScript支持
- **组件分层结构清晰** (7/10分)
- 明确的views/components分层架构
- 业务组件与基础组件分离
- 服务层(service)与数据层(models)职责分明
- **路由与导航设计** (6/10分)
- 基于React Router 6的现代化路由管理
- 支持嵌套路由和权限控制
#### 不足
- **配置管理分散** (-3分)
- 配置信息散布在config.ts和各组件中
- 硬编码较多,环境适配性差
- 缺少统一的配置管理机制
- **缺少微前端架构考虑** (-3分)
- 单体应用架构,不利于大型系统扩展
- 未考虑模块联邦等现代化架构模式
- **API层设计不够规范** (-3分)
- 缺少统一的API拦截和错误处理
- 请求管理分散,缺少集中式管理
#### 改进建议
1. 实现统一的配置管理系统,支持多环境部署
2. 引入微前端架构,支持模块化开发和独立部署
3. 建立标准化的API层包含拦截器、错误处理、重试机制
4. 增加权限管理和路由守卫机制
### 2. 代码质量 (25分)
**得分: 16/25**
#### 优势
- **TypeScript类型安全** (7/8分)
- 100% TypeScript覆盖率类型定义完整
- 严格的tsconfig配置启用所有严格模式选项
- 良好的接口定义和类型推导
- **代码组织良好** (5/7分)
- 文件结构清晰,按功能域组织
- 命名规范相对统一
- 模块化程度较高
- **依赖管理合理** (4/5分)
- 使用成熟的依赖包版本
- 包管理结构清晰
#### 不足
- **缺少单元测试** (-5分)
- 未发现任何单元测试文件
- 缺少自动化测试覆盖
- 代码质量验证不完善
- **代码规范不统一** (-2分)
- 存在大量注释代码和@ts-ignore
- 代码格式和风格不一致
- 缺少pre-commit hooks和代码检查
- **错误处理不完善** (-2分)
- 异常处理机制不统一
- 缺少全局错误边界
- 日志记录机制缺失
#### 改进建议
1. 引入Jest + Testing Library进行单元测试覆盖
2. 配置ESLint + Prettier统一代码风格
3. 添加pre-commit hooks进行代码质量检查
4. 实现全局错误边界和日志系统
5. 清理注释代码,优化代码可读性
### 3. 技术选型 (20分)
**得分: 15/20**
#### 优势
- **核心技术栈现代化** (6/7分)
- React 18 + TypeScript 4.7.4:最新稳定版本
- Antd 4.21.7成熟的企业级UI组件库
- OpenLayers 7.4.0专业的GIS地图解决方案
- **状态管理选型合理** (5/6分)
- Rematch轻量级Redux替代方案
- 类型安全API简洁
- 适合中大型应用状态管理
- **构建工具现代化** (4/7分)
- Craco自定义Create React App配置
- Less预处理器支持
- 支持自定义webpack配置
#### 不足
- **依赖版本过旧** (-2分)
- Antd 4.x版本较老缺少最新特性
- 一些依赖可能存在安全漏洞
- 缺少定期的依赖更新机制
- **缺少现代化工具链** (-3分)
- 未使用Vite等现代化构建工具
- 缺少Bundle分析工具
- 没有Performance预算配置
#### 改进建议
1. 升级Antd到5.x版本获得更好的性能和特性
2. 考虑迁移到Vite构建工具提升开发体验
3. 引入Bundle分析工具优化打包体积
4. 建立依赖更新和安全扫描机制
### 4. 性能表现 (15分)
**得分: 9/15**
#### 优势
- **React性能优化意识** (4/6分)
- 104个文件使用了useEffect/useMemo/useCallback
- 具备基本的React性能优化概念
- 组件懒加载和代码分割支持
- **地图组件优化** (3/5分)
- OpenLayers地图渲染相对优化
- 支持图层管理和数据懒加载
#### 不足
- **打包体积过大** (-3分)
- node_modules达到4.0GB,依赖体积过大
- 缺少Bundle优化和代码分割策略
- 未进行资源压缩和优化
- **缺少性能监控** (-2分)
- 未集成性能监控工具
- 缺少Core Web Vitals监控
- 无性能指标收集和分析
- **缓存策略不完善** (-1分)
- 缺少HTTP缓存策略配置
- 未实现Service Worker缓存
#### 改进建议
1. 实施Bundle分析和优化减少打包体积
2. 引入React.lazy和Suspense进行代码分割
3. 集成性能监控工具如Lighthouse CI
4. 实现Service Worker离线缓存
5. 优化图片和静态资源加载策略
### 5. 可维护性 (10分)
**得分: 6/10**
#### 优势
- **文档结构相对清晰** (3/4分)
- 目录结构规范,易于理解
- 组件职责划分明确
- 配置文件集中管理
- **模块化程度高** (3/6分)
- 功能模块独立性强
- 组件复用性较好
- 状态管理模块化
#### 不足
- **缺少技术文档** (-2分)
- 未发现README或技术文档
- 缺少架构设计文档
- API文档不完整
- **开发工具链不完善** (-2分)
- 缺少开发环境标准化配置
- 未配置代码质量检查工具
- 缺少自动化部署流程
#### 改进建议
1. 编写项目技术文档和架构说明
2. 完善开发工具链配置
3. 建立代码规范和最佳实践指南
4. 实现CI/CD自动化流程
## 总体评价
### 最终得分: 67/100
### 项目优势
1. **技术栈选择合理**采用现代化的React + TypeScript技术栈
2. **类型安全性强**100% TypeScript覆盖类型定义完整
3. **架构清晰**:分层架构明确,职责分离良好
4. **GIS功能专业**OpenLayers集成提供了专业的地图功能
### 主要问题
1. **测试覆盖率缺失**:没有任何单元测试,质量保证不足
2. **性能优化不足**:打包体积过大,缺少性能监控
3. **开发工具链不完善**:缺少代码质量检查和自动化流程
4. **文档缺失**技术文档和API文档不完整
### 改进优先级
1. **高优先级**:添加单元测试、性能优化、依赖更新
2. **中优先级**:完善开发工具链、代码规范、错误处理
3. **低优先级**:架构升级、微前端改造、文档完善
### 总体评估
TSG-WEB水利水务管理系统是一个功能相对完整的企业级前端项目在技术选型和架构设计方面表现良好但在代码质量保证、性能优化和开发工具链方面还有较大提升空间。项目具备良好的基础通过系统性的改进可以达到企业级生产环境的高标准要求。

View File

@ -1,74 +0,0 @@
📊 评分概览
总分: 67/100 - 达到企业级项目基础要求,但有较大提升空间
各维度得分
1. 架构设计: 21/30分 ✅
2. 代码质量: 16/25分 ⚠️
3. 技术选型: 15/20分 ✅
4. 性能表现: 9/15分 ❌
5. 可维护性: 6/10分 ❌
🏆 主要优势
技术实力强
- 100% TypeScript覆盖率: 严格的类型安全保障
- 现代化技术栈: React 18 + Ant Design + OpenLayers
- 专业领域深耕: 完整的水利行业功能模块
架构基础好
- 分层清晰: Component-View-Model-Service分层
- 模块化设计: 按业务域合理组织代码
- 状态管理规范: Redux/Rematch统一模式
⚠️ 关键问题
性能短板明显
- 依赖体积过大: 4.0GB node_modules严重影响开发和构建
- 缺少性能监控: 无LCP、FCP等核心指标监控
- 优化不充分: 未充分利用React 18性能特性
工程化不完善
- 测试缺失: 0%单元测试覆盖率
- 代码规范: 缺少ESLint、Prettier统一标准
- 文档不足: 缺少API文档和组件文档
🚀 改进优先级
🔴 高优先级 (立即执行)
1. 依赖治理: 清理无用依赖,减小包体积
2. 性能优化: 实现代码分割、懒加载、虚拟滚动
3. 测试建设: 建立Jest + React Testing Library测试体系
🟡 中优先级 (3个月内)
4. 监控体系: 接入性能监控和错误追踪
5. 代码规范: 配置ESLint + Prettier + Husky
6. 文档完善: 补充组件文档和API文档
🟢 低优先级 (6个月内)
7. 技术升级: 升级到Ant Design 5.x、React 19
8. 架构优化: 考虑微前端架构
📈 改进潜力
当前得分 67/100通过系统性改进预计可提升至
- 3个月: 75-80分 (完成关键优化)
- 6个月: 85-90分 (企业级标准)
- 1年: 90+分 (行业标杆水平)
💡 总结
这是一个基础良好但需打磨的企业级项目。技术选型和架构设计符合现代前端标准,具
备成为行业标杆的潜力。重点需要解决性能问题和工程化短板,建立完善的开发质量保
障体系。
建议: 成立前端优化专项小组按照优先级逐步推进改进6个月内可以达到企业级项目
的高标准要求。

View File

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="20px" height="18px" xmlns="http://www.w3.org/2000/svg">
<g transform="matrix(1 0 0 1 -325 -30 )">
<path d="M 18.7901234592014 17.2500000073242 C 21.3086419704861 4.95 9.20987654079861 4.35000001464844 9.20987654079861 4.34999999267578 L 9.20987654079861 1.60000000488281 C 8.96296295572917 0.45 8.02469136284722 1.15000000488281 8.02469136284722 1.15000000488281 L 1.50617282986111 6.80000000976563 C 0.0740740668402778 7.80000000732422 1.40740740017361 8.55 1.40740740017361 8.55 L 7.82716050347222 14.1499999951172 C 9.11111111111111 15.1000000048828 9.2098765625 13.6499999853516 9.20987654079861 13.6500000073242 L 9.20987654079861 11.0999999926758 C 15.7283950520833 9.05000000976563 18.39506171875 17.2500000073242 18.39506171875 17.2500000073242 C 18.6419753038194 17.7000000073242 18.7901234375 17.2500000073242 18.7901234592014 17.2500000073242 Z " fill-rule="nonzero" fill="#2c2c2c" stroke="none" transform="matrix(1 0 0 1 325 30 )" />
</g>
</svg>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 181 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 356 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -30,7 +30,6 @@
<script type="text/javascript" src="%PUBLIC_URL%/imouplayer.js"></script>
<script src="%PUBLIC_URL%/h5Player/h5player.min.js"></script>
<title>檀树岗水库现代化运行管理矩阵平台</title>
<!-- <div class="mytest"></div> -->
<style>
.lf{
@ -44,17 +43,6 @@
display:block;
clear:both;
}
.mytest{
width: 10px;
height: 10px;
/* border: 1px solid red; */
background-color: red;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-100%, -100%);
z-index: 999999;
}
</style>
</head>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 503 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 133 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 478 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,11 @@
Model Information:
* title: El Pontón de la Oliva | PATONES, MADRID
* source: https://sketchfab.com/3d-models/el-ponton-de-la-oliva-patones-madrid-eb3cb2b70a8d439aa8abf598989315c3
* author: Arqueomodel3D (https://sketchfab.com/juanbrualla)
Model License:
* license type: CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
* requirements: Author must be credited. Commercial use is allowed.
If you use this 3D model in your project be sure to copy paste this credit wherever you share it:
This work is based on "El Pontón de la Oliva | PATONES, MADRID" (https://sketchfab.com/3d-models/el-ponton-de-la-oliva-patones-madrid-eb3cb2b70a8d439aa8abf598989315c3) by Arqueomodel3D (https://sketchfab.com/juanbrualla) licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)

BIN
public/models/dam/scene.bin Normal file

Binary file not shown.

1178
public/models/dam/scene.gltf Normal file

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 MiB

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Some files were not shown because too many files have changed in this diff Show More