# 网络货运智慧运营中心规划 ## 1. 产品定位 本项目是一套无需后台接口、可离线演示的网络货运数据大屏。画面围绕“货源、运力、运输、履约、风控、效益”展开，用一个 1920×1080 驾驶舱讲清从货源发布到车辆履约的完整业务链路。 目标观众为平台管理者、企业客户及展示来宾。首版采用阿里 DataV 类工业科技视觉，但不复制具体模板；核心记忆点是中央全国货运态势图、贯穿全屏的线路流光，以及风险发生时地图与告警面板同步响应。 ## 2. 信息架构 ### 顶部全局区 - 平台累计运单：累计业务规模 - 今日运输吨位：当日承运货重 - 今日运费金额：当日运单含税运费 - 当前在途车辆：处于运输中的去重车辆 - 活跃司机：当日有接单、装卸或运输行为的司机 - 累计运输里程：已完成及在途运单里程 ### 左侧供给区 1. 运单量趋势：最近 12 小时发布与完成运单 2. 货物类型：钢材、煤炭、建材、农产品、快消、机械、化工 3. 运力状态：空闲、待装、装货、运输、待卸、异常 4. 车辆构成：高栏、厢式、平板、冷藏、罐式 5. 货源城市排行：货源量前五城市 ### 中央态势区 1. 伪 3D 中国地图与视觉地台 2. 重点物流枢纽脉冲 3. 城际货运飞线与流动光点 4. 车辆沿线路移动 5. 省份业务热度与货运光柱 6. 当前焦点线路图文浮层 ### 右侧运营区 1. 实时风险预警 2. 准时装货、准时送达、回单上传履约仪表 3. 区域经营排行 4. 司机行为雷达 5. 吨公里运价、空驶率、车辆利用率、等待时长 ### 底部调度区 1. 实时运单流水 2. 热门线路排行 3. 智能调度匹配过程 4. 节省空驶里程、碳减排、新能源车辆占比 ## 3. 视觉规范 - 基准画布：1920×1080，整体等比缩放并居中 - 背景：`#020913` 至 `#061b2d`，叠加道路网格、噪点和径向辉光 - 主色：青蓝 `#19d9ff`，用于常规数据与线路 - 辅色：深蓝 `#1668ff`、紫青 `#6af2e7` - 强调：金色 `#ffc857`，用于金额、重点线路和排名 - 风险：橙色 `#ff8a34`、红色 `#ff415d` - 字体：标题使用窄体科技字族回退，正文使用中文黑体回退；数字使用等宽字族 - 面板：透明深蓝底、切角、细描边、四角短线与顶部扫描光，不使用通用圆角白卡 - 动画：首屏分层进入 800–1400ms；飞线 3–6s；扫描 6–10s；告警呼吸 1.8s - 降级：系统开启减少动态效果时，停止粒子、扫描与循环位移动画 ## 4. 数据模型与口径 ### 运单 字段包括运单号、货物、重量、起点、终点、距离、单价、运费、车辆、司机、状态、计划及实际时间。 - 运费 = 重量 × 距离 × 吨公里单价 - 状态为待调度、待装、运输中、待卸、已完成、异常 - 总运单 = 各状态运单之和 ### 车辆与司机 车辆字段包括车牌、车型、载重、状态、当前位置、线路进度和新能源标记。司机字段包括姓名、评分、接单数、准时率、安全分和活跃状态。 - 在途车辆数不大于活跃车辆数 - 一个运输中运单绑定一辆车和一名司机 - 车辆位置由线路起终点及进度插值得到 ### 线路与区域 线路包含起终点、坐标、距离、运单量、运输吨位、平均运价、准时率和风险数。区域数据由线路和运单聚合，不单独随机生成。 ### 风险 风险包括轨迹偏离、长时停留、疲劳驾驶、超速、人车不一致、围栏异常。每条风险绑定车辆、线路、等级、发生时间和处理状态。 ### 效益 - 空驶率 = 空驶里程 ÷ 总行驶里程 - 车辆利用率 = 执行任务车辆 ÷ 可用车辆 - 回单上传率 = 已上传回单完成单 ÷ 已完成运单 - 碳减排为减少空驶里程乘以统一排放因子，仅作为演示估算值 ## 5. 模拟策略 采用固定随机种子生成基础数据，确保刷新后业务规模稳定；运行时每 2 秒推进车辆位置，每 4 秒新增或完成一笔运单，每 6–12 秒触发一次可控风险。所有图表共享同一数据源，禁止各组件自行产生互相冲突的随机数。 演示规模为 30 个物流节点、10 条重点线路、约 180 辆车辆、240 名司机和 600–1000 笔运单。晚间线路活跃度、货物占比、地区规模与价格保持符合行业展示语境的差异。 ## 6. 素材规范 - 生成式素材：夜间智慧物流园区、重卡侧前方透明主体、调度中心氛围背景 - 自制 SVG：车型剪影、货类图标、风险图标、科技边框、雷达和道路纹理 - 地图：使用项目内中国 GeoJSON，边界仅用于数据展示 - 图片统一转换为 WebP，压暗高光、叠加青蓝色调，不携带品牌、水印或文字 - 外部素材必须记录来源及商用许可；无法确认授权时不用 ## 7. 组件与数据流 页面容器只负责布局。模拟器提供只读状态和明确操作；各面板通过 props 接收数据，通过事件上报选中的区域、线路或车辆。地图渲染层接受统一的 `MapScene`，首版连接 ECharts，二期可替换为 Three.js 而不改变业务组件。 ## 8. 性能目标 - 生产构建无 TypeScript 错误 - 主流 Chromium 浏览器正常运行 - 1920×1080 展示机上常态动画目标 50–60 FPS - 首屏本地资源加载目标低于 3 秒 - 1366×768 与 2560×1440 下完整等比显示，无裁切、无横向滚动 - 定时器和图表实例在组件卸载时全部销毁 ## 9. 验收清单 1. 页面包含不少于 16 个独立信息模块，且图表、图像和数据文字比例均衡 2. 中央地图具备立体地台、枢纽、飞线、车辆点和焦点线路 3. 告警列表、地图异常线路与顶部风险提示能够联动 4. 模拟数据满足金额、运单状态、车辆及区域聚合关系 5. 运单列表、车辆位置和时间持续更新且长时间运行稳定 6. 背景、卡车主体及行业 SVG 素材风格统一，无版权风险 7. 支持全屏比例适配和减少动态效果 8. 完成类型检查、生产构建、浏览器截图及多分辨率验收 ## 10. 二期真 3D 首版不引入重型模型。二期在现有 `MapRenderer` 边界内增加 Three.js 渲染器，加载压缩后的 GLTF 卡车、地形挤出、光带道路和镜头巡航。业务数据、指标面板及交互协议保持不变。