可视化大屏设计

页面以“科技大厦”为情境锚点，采用“总-分-总”三层结构：顶部全局卡片（时间、天气、位置）建立时空上下文；中段房源与租户双概览，用卡片化布局快速回答“还有多少空间、谁来用”；底部运营与服务指标分区呈现，形成“运营仪表盘”。

遵循 NNG F-Pattern：

• 左上角“空置率 49.24 %”以红色高亮，0.5 秒内传递资产健康度；

• 右上方“已租赁面积 40,065 m²”用绿色进度环，与空置率形成直观对比；

• 折线增长率放在第二视觉落点，避免首屏信息过载。

• 颜色语义：红（告警）- 绿（健康）- 灰（中性），符合金融/地产行业心智；

• 图标+数字组合：A/B 座建筑用 3D 线稿图标，悬浮出现楼层-面积 Tooltip，减少点击；

• 交互模式：关键指标（如“筒灯不亮”）支持一键报修，工单弹窗保留现场截图，缩短修复链路。

桌面端三栏卡片布局；平板折叠为两栏；手机端纵向滚动，卡片全宽，保证 320 px 以上可读。SVG 矢量图标+CSS Grid 保证高清屏不糊。

• 所有对比色通过 WCAG 2.1 AA 校验；

• 数据卡片预留 JSON-LD 微数据，方便后续接入 BI 大屏或语音助手。