LineChart

• pv
• uv

显示数据格式

<LineChart width={730} height={250} data={data}
  margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
  <CartesianGrid strokeDasharray="3 3" />
  <XAxis dataKey="name" />
  <YAxis />
  <Tooltip />
  <Legend />
  <Line type="monotone" dataKey="pv" stroke="#8884d8" />
  <Line type="monotone" dataKey="uv" stroke="#82ca9d" />
</LineChart>

父组件

• <ResponsiveContainer />

子组件

• <XAxis />
• <YAxis />
• <ReferenceArea />
• <ReferenceDot />
• <ReferenceLine />
• <Brush />
• <CartesianGrid />
• <Legend />
• <Tooltip />
• <Line />
• <Customized />
• validate svg elements…

Properties

• layout 'horizontal' | 'vertical'

布局类型，是横向的还是纵向的。

默认值：'horizontal'

• syncId String optional

如果任何两个或者多个类目型图表（LineChart, AreaChart, BarChart, ComposedChart）具有相同的 syncId，这两个图表可以联动，包括 Tooltip 以及 Brush 的联动。

示例：

• Two synchronized LineChart and an AreaChart

• width Number

图表的宽度。

• height Number

图表的高度。

• data Array

输入数据，现在支持的类型是对象数组。

格式：

[{name: 'a', value: 12}]

• margin Object

图表四周的留白大小，支持传入部分值（如： { top: 5 }）

默认值：{ top: 5, right: 5, bottom: 5, left: 5 }

格式：

{ top: 5, right: 5, bottom: 5, left: 5 }

• onClick Function optional

鼠标在图表图形区域点击事件的回调函数。

• onMouseEnter Function optional

鼠标在图表图形区域 mouseenter 事件的回调函数。

• onMouseMove Function optional

鼠标在图表图形区域 mousemove 事件的回调函数。

• onMouseLeave Function optional

鼠标在图表图形区域 mouseleave 事件的回调函数。