## lineChart.html — 折线图通用模板

### 适用场景
用于展示任何需要折线图可视化的趋势数据分析场景，如碳排放趋势、温度变化、产量趋势、成本变化等。

### 所需 JSON 数据格式

```json
{
  "page_title": "碳排放趋势分析",
  "data": {
    "text_values": {
      "PAGE_TITLE": "碳排放趋势分析",
      "CHART_TITLE": "碳排放趋势",
      "STAT_TITLE": "统计数据",
      "STAT_LABEL_1_1": "当月",
      "STAT_VALUE_1_1": "4441.5 t",
      "STAT_LABEL_1_2": "上月同期",
      "STAT_VALUE_1_2": "1050 t",
      "STAT_LABEL_1_3": "趋势",
      "STAT_VALUE_1_3": "3391.5 % ↑",
      "STAT_VALUE_1_3_CLASS": "up",
      "STAT_LABEL_2_1": "当年",
      "STAT_VALUE_2_1": "5491.5 t",
      "STAT_LABEL_2_2": "去年同期",
      "STAT_VALUE_2_2": "1040.5 t",
      "STAT_LABEL_2_3": "趋势",
      "STAT_VALUE_2_3": "4451 % ↑",
      "STAT_VALUE_2_3_CLASS": "up",
      "TABLE_TITLE": "各月碳排放明细",
      "TABLE_HEADER_1": "月份",
      "TABLE_HEADER_2": "碳排放量（t）",
      "TABLE_HEADER_3": "环比变化",
      "TABLE_HEADER_4": "同比变化",
      "TABLE_ROWS": "<tr><td>1月</td><td>285.6</td><td><span class=\"tag-down\">-3.2% ↓</span></td><td><span class=\"tag-up\">+5.1% ↑</span></td></tr><tr><td>2月</td><td>268.3</td><td><span class=\"tag-down\">-6.1% ↓</span></td><td><span class=\"tag-down\">-2.3% ↓</span></td></tr>",
      "SUGGESTION_TITLE": "减排建议",
      "ANALYSIS_SUMMARY": "全年碳排放量合计 3,556.7 t，较去年同期上涨约 7.2%。其中 3月（312.5t）、5月（325.4t）、8月（318.6t）为全年排放高峰月份，6月（289.2t）和9月（295.3t）排放相对较低。下半年整体排放水平高于上半年，年末两月维持高位运行。",
      "OPTIMIZATION_SUGGESTIONS": "<li>· 3月、5月、8月碳排放明显偏高，建议重点排查该时段高耗能设备运行情况，优化生产调度计划，避免高峰时段非必要能耗。</li><li>· 全年排放整体呈上升趋势，建议加快推进可再生能源替代，提高光伏、风电等清洁能源使用比例，从源头降低碳排放总量。</li><li>· 参考6月、9月低排放时段的运营经验，总结节能措施并推广至全年，争取将年均碳排放控制在目标范围内。</li><li>· 建议对高排放月份开展专项能源审计，识别主要排放源，制定针对性的节能降碳方案并跟踪落实效果。</li>"
    },
    "js_variables": {
      "CHART_X_AXIS_DATA": ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
      "CHART_SERIES_DATA": [285.6, 268.3, 312.5, 298.7, 325.4, 289.2, 301.8, 318.6, 295.3, 308.9, 327.2, 325.3],
      "CHART_Y_AXIS_NAME": "t",
      "CHART_SERIES_NAME": "碳排放量"
    }
  }
}
```

### 字段说明

| 字段 | 类型 | 说明 |
|------|------|------|
| PAGE_TITLE | 字符串 | 页面标题，显示在浏览器标签页 |
| CHART_TITLE | 字符串 | 折线图卡片标题 |
| STAT_TITLE | 字符串 | 统计数据卡片标题 |
| STAT_LABEL_1_1 | 字符串 | 左侧统计块第1行标签 |
| STAT_VALUE_1_1 | 字符串 | 左侧统计块第1行数值 |
| STAT_LABEL_1_2 | 字符串 | 左侧统计块第2行标签 |
| STAT_VALUE_1_2 | 字符串 | 左侧统计块第2行数值 |
| STAT_LABEL_1_3 | 字符串 | 左侧统计块第3行标签 |
| STAT_VALUE_1_3 | 字符串 | 左侧统计块第3行数值（含箭头符号） |
| STAT_VALUE_1_3_CLASS | 字符串 | 左侧统计块第3行样式类，可选值："up"（红色上升）、"down"（绿色下降）、""（默认） |
| STAT_LABEL_2_1 | 字符串 | 右侧统计块第1行标签 |
| STAT_VALUE_2_1 | 字符串 | 右侧统计块第1行数值 |
| STAT_LABEL_2_2 | 字符串 | 右侧统计块第2行标签 |
| STAT_VALUE_2_2 | 字符串 | 右侧统计块第2行数值 |
| STAT_LABEL_2_3 | 字符串 | 右侧统计块第3行标签 |
| STAT_VALUE_2_3 | 字符串 | 右侧统计块第3行数值（含箭头符号） |
| STAT_VALUE_2_3_CLASS | 字符串 | 右侧统计块第3行样式类，可选值："up"（红色上升）、"down"（绿色下降）、""（默认） |
| TABLE_TITLE | 字符串 | 明细表格卡片标题 |
| TABLE_HEADER_1 | 字符串 | 表格第1列表头 |
| TABLE_HEADER_2 | 字符串 | 表格第2列表头 |
| TABLE_HEADER_3 | 字符串 | 表格第3列表头 |
| TABLE_HEADER_4 | 字符串 | 表格第4列表头 |
| TABLE_ROWS | 字符串（HTML） | 表格数据行的完整 HTML，每行格式：`<tr><td>值1</td><td>值2</td><td><span class="tag-up/tag-down">值3</span></td><td><span class="tag-up/tag-down">值4</span></td></tr>` |
| SUGGESTION_TITLE | 字符串 | 建议卡片标题 |
| ANALYSIS_SUMMARY | 字符串 | 数据总结文本，2-4句话概述数据情况 |
| OPTIMIZATION_SUGGESTIONS | 字符串（HTML） | 优化建议列表的完整 HTML，每条建议格式：`<li>· 建议内容</li>` |
| CHART_X_AXIS_DATA | 数组 | 折线图 X 轴数据，字符串数组，如 `["1月", "2月", "3月"]` |
| CHART_SERIES_DATA | 数组 | 折线图 Y 轴数据，数值数组，与 X 轴数据一一对应 |
| CHART_Y_AXIS_NAME | 字符串 | Y 轴单位名称，如 "t"、"kWh"、"℃" |
| CHART_SERIES_NAME | 字符串 | 图表系列名称，显示在 tooltip 中 |

### 图表特性

折线图包含以下特性：
- 平滑曲线显示
- 区域填充（渐变色）
- 圆点标记
- 鼠标悬停显示详细数据

### 注意事项

1. **TABLE_ROWS** 和 **OPTIMIZATION_SUGGESTIONS** 字段需要填入完整的 HTML 代码
2. **STAT_VALUE_X_X_CLASS** 字段用于控制数值颜色：
   - `"up"` - 红色加粗（表示上升/增长）
   - `"down"` - 绿色加粗（表示下降/减少）
   - `""` - 默认颜色
3. **CHART_X_AXIS_DATA** 和 **CHART_SERIES_DATA** 数组长度必须一致
4. 表格标签样式：
   - `tag-up` - 红色背景（表示上升）
   - `tag-down` - 绿色背景（表示下降）

---