┌──────────────────────────────────────────────────────────┐│                     浏览器 (Client)                       ││  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌────────────┐  ││  │ Bootstrap│  │ ECharts │  │ ECharts │  │ dashboard  │  ││  │  CSS/JS  │  │  Core   │  │  -GL    │  │    .js     │  ││  └─────────┘  └─────────┘  └─────────┘  └────────────┘  │└──────────────────────┬───────────────────────────────────┘                       │ HTTP (JSON API / HTML)┌──────────────────────▼───────────────────────────────────┐│                  Django 应用层                             ││  ┌─────────────┐  ┌─────────────┐  ┌──────────────────┐  ││  │   urls.py   │→ │  views.py   │→ │   templates/     │  ││  │  (路由分发)  │  │ (视图逻辑)   │  │  (模板渲染)      │  ││  └─────────────┘  └──────┬──────┘  └──────────────────┘  ││                          │                                ││  ┌─────────────┐  ┌──────▼──────┐  ┌──────────────────┐  ││  │  forms.py   │  │  models.py  │  │   admin.py       │  ││  │ (表单验证)   │  │  (数据模型)  │  │  (后台管理)      │  ││  └─────────────┘  └──────┬──────┘  └──────────────────┘  │└──────────────────────────┼───────────────────────────────┘                           │ Django ORM┌──────────────────────────▼───────────────────────────────┐│                    MySQL 数据库                            ││              design_129_emission.emission_records          │└──────────────────────────────────────────────────────────┘

CSV 文件 ──(import_emissions 命令)──→ MySQL ──(ORM Query)──→ Django View                                                                  │                                                    ┌─────────────┼─────────────┐                                                    ▼             ▼             ▼                                              pandas DataFrame  JSON API    Template                                              (聚合/统计/分析)  (前端渲染)   (HTML页面)                                                    │             │                                                    └──────┬──────┘                                                           ▼                                                    ECharts 图表

city/├── manage.py                          # Django 管理入口├── requirements.txt                   # Python 依赖├── city_emission_data.csv             # 原始数据集 (4.16 MB)├── database_init.sql                  # 数据库初始化脚本├── design_129_emission.sql            # 完整数据库导出│├── emission_system/                   # Django 项目配置│   ├── __init__.py│   ├── settings.py                    # 全局配置（数据库、中间件、模板、静态文件）│   ├── urls.py                        # 根路由│   └── wsgi.py                        # WSGI 入口│├── dashboard/                         # 核心应用│   ├── __init__.py│   ├── apps.py                        # 应用配置│   ├── models.py                      # 数据模型 (EmissionRecord)│   ├── views.py                       # 视图函数 (1731 行，含 15 个 API)│   ├── urls.py                        # 应用路由 (34 条)│   ├── forms.py                       # 表单类 (5 个)│   ├── admin.py                       # Admin 后台配置│   ├── management/│   │   └── commands/│   │       ├── import_emissions.py    # CSV 数据导入命令│   │       └── seed_admin.py          # 管理员账号初始化│   └── migrations/│       └── 0001_initial.py            # 初始迁移│├── static/dashboard/│   ├── css/dashboard.css              # 自定义样式 (2339 行)│   ├── js/dashboard.js                # 前端逻辑 (1239 行)│   ├── img/                           # 城市 SVG 插图│   └── vendor/                        # 第三方库│       ├── bootstrap/                 # Bootstrap 5 CSS/JS│       ├── bootstrap-icons/           # 图标字体│       ├── echarts/                   # ECharts 核心 + china.js│       └── echarts-gl/                # ECharts 3D 扩展│├── templates/│   ├── base.html                      # 认证页面基础模板│   └── dashboard/│       ├── layout.html                # 仪表盘布局（侧边栏 + 顶栏 + 内容区）│       ├── login.html                 # 登录页│       ├── register.html              # 注册页│       ├── overview.html              # 态势总览│       ├── geo.html                   # 地域分布│       ├── emission.html              # 排放趋势│       ├── vehicle.html               # 车辆结构│       ├── forecast.html              # 预测分析│       ├── data_management.html       # 数据管理│       ├── user_management.html       # 用户管理│       ├── profile.html               # 个人资料│       ├── password_change.html       # 修改密码│       ├── record_form.html           # 记录新增/编辑│       ├── record_confirm_delete.html # 记录删除确认│       └── partials/│           └── filter_dock.html       # 筛选器组件│└── docs/    ├── city_drilldown_technical_doc.md    └── technical_document.md          # 本文档

class EmissionRecord(models.Model):    # ── 地理维度 ──    city = CharField(max_length=50)          # 城市名称    province = CharField(max_length=50)      # 省份名称    region = CharField(max_length=30)        # 区域（华东、华南等）    # ── 时间维度 ──    date = DateField()                       # 具体日期    year = PositiveSmallIntegerField()       # 年份（冗余字段，加速查询）    month = PositiveSmallIntegerField()      # 月份（冗余字段）    weekday = PositiveSmallIntegerField()    # 星期几（1=周一，7=周日）    is_workday = BooleanField()              # 是否工作日    # ── 车辆维度 ──    vehicle_stock_10k = FloatField()         # 机动车保有量（万辆）    new_energy_ratio = FloatField()          # 新能源车占比（0-1）    gasoline_ratio = FloatField()            # 汽油车占比（0-1）    diesel_ratio = FloatField()              # 柴油车占比（0-1）    avg_vehicle_age = FloatField()           # 平均车龄（年）    # ── 排放维度 ──    co2_emission = FloatField()              # CO2 排放量（吨/日）    co_emission = FloatField()               # CO 排放量（吨/日）    nox_emission = FloatField()              # NOx 排放量（吨/日）    pm25_contribution = FloatField()         # PM2.5 贡献（微克/立方米）    aqi_index = PositiveSmallIntegerField()  # AQI 指数    # ── 气象维度 ──    avg_temperature = FloatField()           # 月均气温（摄氏度）    humidity = FloatField()                  # 相对湿度（%）    wind_speed = FloatField()                # 平均风速（米/秒）    # ── 经济维度 ──    population_10k = PositiveIntegerField()  # 人口（万人）    gdp_100m = PositiveIntegerField()        # GDP（亿元）    # ── 系统字段 ──    created_at = DateTimeField(auto_now_add=True)  # 创建时间

CREATE DATABASE IF NOT EXISTS design_129_emission  DEFAULT CHARACTER SET utf8mb4  DEFAULT COLLATE utf8mb4_unicode_ci;

{  "ok": true,  "data": {    "provinces": ["上海市", "云南省", ...],    "cities_by_province": {      "上海市": ["上海"],      "云南省": ["昆明"],      ...    },    "years": [2019, 2020, 2021, 2022, 2023]  }}

{  "ok": true,  "empty": false,  "data": {    "cards": [      {        "key": "co2",        "label": "CO2日排放总量",        "value": 123.45,        "unit": "万吨",        "trend": -2.3      }    ],    "meta": {      "records": 5000,      "cities": 36,      "provinces": 30,      "regions": 7,      "year_range": [2019, 2023]    },    "region_mix": [      {        "region": "华东",        "co2": 50000.00,        "aqi": 85.3,        "nox": 3000.00,        "city_count": 8      }    ]  }}

{  "data": {    "monthly": [      { "label": "2023-01", "co2": 50000, "co": 3000, "nox": 2000, "pm25": 45.2, "aqi": 85.3, "new_energy": 15.2 }    ],    "yearly": [      { "year": 2023, "co2": 600000, "nox": 24000, "aqi": 82.1, "vehicle": 350.5, "new_energy": 18.3 }    ],    "weekday": [      { "weekday": 1, "is_workday": true, "co2": 450.5, "aqi": 85.3 }    ]  }}

{  "data": {    "provinces": [      {        "name": "广东省",        "geo_name": "广东",        "region": "华南",        "co2": 80000.00,        "aqi": 78.5,        "coord": [113.2669, 23.1333]      }    ],    "cities": [      {        "name": "广州",        "province": "广东省",        "co2": 25000.00,        "aqi": 75.2,        "coord": [113.2644, 23.1291]      }    ]  }}

{  "data": {    "narrative": [      "华东区域累计 CO2 排放最高，占当前筛选范围的 32.5%。",      "广东省广州是排放压力最高城市，CO2 累计 12.50 万吨。"    ],    "risk_rank": [      { "city": "广州", "province": "广东省", "score": 85.3, "co2": 25000, "aqi": 75.2, "new_energy": 18.5 }    ],    "efficiency_rank": [...],    "pressure_rank": [...],    "region_profile": [...],    "workday_compare": [...]  }}

{  "data": {    "history": [{ "label": "2023-01", "value": 50000 }],    "forecast": [{ "label": "2024-01", "value": 52000 }],    "method": "LinearRegression + monthly aggregate",    "generated_at": "2024-01-15 10:30:00"  }}

# 1. 创建数据库mysql -u root -p < database_init.sql# 2. 执行迁移python manage.py migrate# 3. 导入 CSV 数据python manage.py import_emissions --path city_emission_data.csv --truncate# 4. 创建管理员python manage.py seed_admin --username admin --password 123456

请求 → _filtered_queryset() → _frame() → pandas 聚合 → JSON 序列化 → 响应

risk_score = (    minmax(co2) * 34        # CO2 权重 34%    + minmax(nox) * 22      # NOx 权重 22%    + minmax(aqi) * 24      # AQI 权重 24%    + minmax(pm25) * 14     # PM2.5 权重 14%    + (1 - minmax(new_energy)) * 6  # 新能源占比反向权重 6%)

green_score = clamp(    100    - avg_aqi / 3    - avg_co2 / max_co2 * 35    + avg_new_energy * 20,    0, 100)

全国地图 (3D map3D)    │    │ 点击省份    ▼省份下钻 (2D effectScatter)    │    │ 点击面包屑"全国"    ▼返回全国地图

┌─ 状态管理 ──────────────────────────┐│  charts{}      ECharts 实例缓存     ││  state{}       全局状态（选项、模态） ││  drilldown{}   下钻状态             │└────────────────────────────────────┘┌─ 工具函数 ──────────────────────────┐│  queryString()     构建筛选参数      ││  getJson()         API 请求封装      ││  _num()/_int()     数值安全转换      ││  escapeHtml()      XSS 防护         ││  showToast()       通知系统          │└────────────────────────────────────┘┌─ 图表渲染 ──────────────────────────┐│  renderMap()         3D/2D 地图     ││  renderTrend()       趋势折线图      ││  renderNightingale() 南丁格尔玫瑰图  ││  renderHeatmap()     热力矩阵       ││  renderCorrelation() 相关性矩阵     ││  renderSankey()      桑基流图       ││  renderFunnel()      漏斗图         ││  renderRadar()       雷达图         ││  renderGauge()       仪表盘         ││  renderScatter()     散点图         ││  renderBoxplot()     箱线图         ││  renderTreemap()     矩形树图       ││  renderPrediction()  预测折线图     ││  ...                               │└────────────────────────────────────┘┌─ 页面加载器 ────────────────────────┐│  loadOverviewPage()   态势总览      ││  loadGeoPage()        地域分布      ││  loadEmissionPage()   排放趋势      ││  loadVehiclePage()    车辆结构      ││  loadForecastPage()   预测分析      │└────────────────────────────────────┘┌─ 交互功能 ──────────────────────────┐│  initChartTools()     图表工具栏    ││  focusChart()         图表聚焦模态  ││  downloadChart()      图表导出PNG   ││  enterDrilldown()     省份下钻      ││  exitDrilldown()      返回全国      ││  applyCompactMode()   紧凑模式      │└────────────────────────────────────┘

# 1. 克隆项目cd city/# 2. 安装依赖pip install -r requirements.txt# 3. 创建数据库mysql -u root -p < database_init.sql# 4. 配置数据库连接（环境变量或修改 settings.py）export MYSQL_DATABASE=design_129_emissionexport MYSQL_USER=rootexport MYSQL_PASSWORD=your_passwordexport MYSQL_HOST=localhostexport MYSQL_PORT=3306# 5. 执行数据库迁移python manage.py migrate# 6. 导入数据python manage.py import_emissions --path city_emission_data.csv --truncate# 7. 创建管理员python manage.py seed_admin --username admin --password your_password# 8. 启动服务python manage.py runserver 0.0.0.0:8000