跳到主要内容

AreaChart

基本使用

百分比面积图

垂直图表

可横向缩放图表

格式化 (一)

格式化 (二)

API

AreaChart 属性

<AreaChart {...props} /> 相当于 <VarietyChart type="area" {...props}/>

VarietyChart 属性

参数类型默认值
type?'line' | 'area' | 'bar' | 'composed' | 'pie'-

图表的类型,分别对应 <LineChart/>,<AreaChart/>,<BarChart/>,<ComposedChart/>。 这个属性在 VarietyChart 组件中是必填的,LinChart 等是非必填,这里为了兼容才设置为非必填。

data?ChartData-

数据源。

useResponsiveContainer?booleantrue

是否使用响应式,开启的话浏览器窗口大小改变会响应式适应

xAxisFormat?string-

x轴 value 方式,内部做了处理,具体请看 getFormatValue

yAxisFormat?string-

y轴 value 方式,内部做了处理,具体请看 getFormatValue

xAxisFormatter?Formatter-

x轴 value 格式化函数。

yAxisFormatter?Formatter-

y轴 value 格式化函数。

width?number-

图表宽度,配合 recharts ResponsiveContainer 组件使用不需要设置。

height?number300

图表高度,配合 recharts ResponsiveContainer 组件使用不需要设置。

layout?'horizontal' | 'vertical''horizontal'

图表布局方式,水平或者垂直。

brush?booleanfalse

图表是否可以横向缩放。

stackOffset?literal-