---
title: API
order: 6
docGenIncludes:
  - src/components/YwLineChart/index.tsx
---

组件参数说明：

```ts
/** Meta 定义 */
export interface IMeta {
  /** 别名 */
  alias?: string;
  min?: number;
  max?: number;
  /** 展示刻度 */
  tickCount?: number;
  /** 格式化 */
  formatter?: (v: any) => string;
}
/** 比例展示多数据的数据映射 */
export interface IYFieldMapItems {
  [key: string]: {
    /** y轴字段 */
    title: string;
    /** 格式化展示方法。存在formater优先使用formater. 不存在则使用dataType。否则直接显示原数据 */
    formatter?: (v: any) => string;
    /** 数据类型。优先级低于formatter，自动格式化。类型参考 formatData 函数 */
    dataType?: FormatType;
  };
}
/**  折线Line 组件参数 */
export interface YwLineChartProps {
  /** 数据 */
  data: any[];
  /** 附加样式名 */
  className?: string;
  /** 自定义样式 */
  style?: React.CSSProperties;
  /** 周边间距 */
  padding?: number[];
  /** x轴字段 */
  xField: string;
  /** x轴别名&格式化等配置 */
  xFieldMeta?: IMeta;
  /** y轴字段 默认：value */
  yField?: string;
  /** y轴别名&格式化等配置 */
  yFieldMeta?: IMeta;
  /** 是否曲线 */
  smooth?: boolean;
  /** 分组字段。多条折线时使用 */
  seriesField?: string;
  /** 是否显示底部滑块 */
  showSliderNum?: number;
  /** charts 原始配置. 参考 antd charts Line 参数配置 */
  originalProps?: LineConfig;
  /** 是否比例展示模式。该模式会将Y轴数据转换为百分比进行展示。具体可参考示例DEMO */
  proportionMode?: boolean;
  /** yFieldMap */
  yFieldMap?: IYFieldMapItems;
}
```