ScatterChart

• A school
• B school

显示数据格式

<ScatterChart width={730} height={250}
  margin={{ top: 20, right: 20, bottom: 10, left: 10 }}>
  <CartesianGrid strokeDasharray="3 3" />
  <XAxis dataKey="x" name="stature" unit="cm" />
  <YAxis dataKey="y" name="weight" unit="kg" />
  <ZAxis dataKey="z" range={[64, 144]} name="score" unit="km" />
  <Tooltip cursor={{ strokeDasharray: '3 3' }} />
  <Legend />
  <Scatter name="A school" data={data01} fill="#8884d8" />
  <Scatter name="B school" data={data02} fill="#82ca9d" />
</ScatterChart>

父组件

• <ResponsiveContainer />

子组件

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

Properties

• width Number

图表的宽度。

• height Number

图表的高度。

• margin Object optional

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

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

格式：

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

• onClick Function optional

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

• onMouseDown Function optional

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

• onMouseUp Function optional

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

• onMouseMove Function optional

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

• onMouseOver Function optional

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

• onMouseOut Function optional

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

• onMouseEnter Function optional

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

• onMouseLeave Function optional

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