# city-data-screen

**Repository Path**: linzewei27/city-data-screen

## Basic Information

- **Project Name**: city-data-screen
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-04
- **Last Updated**: 2025-08-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 城市体检大屏使用说明

## 项目简介

城市体检大屏是一款用于可视化展示城市各项指标数据的前端应用，通过直观的数据图表和地图展示，帮助决策者快速掌握城市运行状况和发展趋势。

## 环境要求

- Node.js 版本：18.0.0 及以上
- 网络环境：需连接公网（用于加载地图资源和数据接口）

## 安装步骤

1. **安装依赖包**
   ```bash
   npm install
   ```

## 启动应用

1. **开发环境启动**

   ```bash
   npm run dev
   ```

2. **访问应用**
   启动成功后，在浏览器中访问以下地址：
   ```
   http://localhost:3006
   ```

## 注意事项

1. **网络连接**

   - 应用需要连接公网才能正常加载高德地图资源和获取实时数据
   - 确保服务器或本地网络没有限制相关域名的访问

2. **兼容性**

   - 建议使用 Chrome、Edge、Firefox 等现代浏览器的最新版本
   - 最低支持 Chrome 80+、Edge 80+、Firefox 75+

3. **屏幕适配**

   - 该应用专为大屏展示设计，建议使用分辨率 1920×1080 及以上的显示器
   - 虽然本应用做了屏幕自适应但是在小屏幕下也有可能展现效果不佳

4. **mock 数据和后端服务**

   - 本项目已内置 mock 数据，但是因为做了后端开发，所以把 mock 屏蔽掉了，如果有需要，请把 main.ts 中的// import { mockXHR } from "@/mock/index";// mockXHR();注释去掉，特别是后端接口请求不通的情况下

5. **预置路由**
   - 路面除了默认的城市体检大屏路由，还预置了管理系统（/manage/user,/manage/roles）、上传文件（/fileUpload）、体检结果（/resultData）以及 404 界面（/404）

## 常见问题

- **Q: 启动时报 Node 版本错误？**
  A: 请检查 Node.js 版本是否满足 18.0.0 及以上要求，可使用 `node -v` 命令查看当前版本

- **Q: 地图无法加载或显示空白？**
  A: 请检查网络连接是否正常，确保公网访问畅通，以及地图 API 密钥配置正确

- **Q: 依赖安装失败？**
  A: 尝试清除 npm 缓存后重新安装：
  ```bash
  npm cache clean --force
  npm install
  ```

## 联系方式

如有其他问题，请联系技术支持：15521101644/林泽伟