# cxc-szcx-multiLineChart
# 这个多字段趋势图组件具有以下特点和功能：
类型安全：使用 TypeScript 定义了清晰的接口，确保数据类型正确
灵活配置：通过 props 参数可以配置需要展示的字段、时间字段、标题等
多字段展示：支持同时展示多个数据字段的趋势线（如 yl, wd, yc 等）
参考线功能：每个字段都可以设置参考值，自动生成对应的参考线
交互功能：
支持图例筛选，可单独显示 / 隐藏某个字段
提供数据缩放功能，可查看局部数据
悬停时显示详细数据信息
窗口大小变化时自动调整图表
使用示例：
<template>
  <view class="container">
    <multi-field-trend-chart 
      :data-list="dataList"
      time-field="createTime"
      :fields="[
        { field: 'yl', name: '压力', referenceValue: 0.73 },
        { field: 'wd', name: '温度', color: '#ff6347' },
        { field: 'yc', name: '压力差' },
        { field: 'ssll', name: '瞬时流量' },
        { field: 'jrl', name: '累计流量' }
      ]"
      title="文增伴生气外输数据趋势"
      height="600rpx"
    />
  </view>
</template>

<script setup lang="ts">
import MultiFieldTrendChart from '@/components/MultiFieldTrendChart.vue';
import { dataList } from '@/data/trendData'; // 导入您的数据
</script>