YAxis

父组件

• <AreaChart />
• <BarChart />
• <LineChart />
• <ComposedChart />
• <ScatterChart />

子组件

• <Label />

Properties

• hide Boolean

是否隐藏 y 轴。

默认值：false

• dataKey String | Number optional

指定展示的数据维度。

• yAxisId String | Number

y 轴的唯一 id。

默认值：0

• width Number

y 轴的宽度，这个可以根据需要进行配置。

默认值：60

• height Number

y 轴的高度，一般在图表内部计算。

默认值：0

• orientation 'left' | 'right'

y 轴的位置。

默认值：'left'

• type 'number' | 'category'

y 轴的类型：数值轴、类目轴。

默认值：'number'

• domain Array optional

当 y 轴是数值轴时，通过这个配置可以指定 y 轴刻度函数的定义域。这个配置是一个二元数组，数组中的元素可以是一个数值，"auto", "dataMin", "dataMax" 或者类似于"dataMin - 100", "dataMax + 200"这样的字符串。如果任意元素的取值为"auto"，我们会生成可读性高的刻度，并且保证设置的刻度数。

默认值：[0, 'auto']

格式：

<YAxis type="number" domain={['dataMin', 'dataMax']} />
<YAxis type="number" domain={[0, 'dataMax']} />
<YAxis type="number" domain={['auto', 'auto']} />
<YAxis type="number" domain={[0, 'dataMax + 1000']} />
<YAxis type="number" domain={['dataMin - 100', 'dataMax + 100']} />
<YAxis type="number" domain={[dataMin => (0 - Math.abs(dataMin) ) , dataMax => (dataMax * 2) ]} />

示例：

• Numeric XAxis with specified domain

• interval "preserveStart" | "preserveEnd" | "preserveStartEnd" | Number

当值为0时，所有的刻度都会展示。如果值为1，则会间隔1个刻度来展示相应的刻度。当值为 "preserveStart" 时，根据刻度的宽度自动计算间隔，在有足够的空间的情况下，会从头部的刻度开始计算。当值为 "preserveEnd" 时，会从尾部的刻度开始计算是否展示。当值为"preserveStartEnd"，会从头部、尾部的刻度开始计算向中间计算是否展示。

默认值：'preserveEnd'

示例：

• the meaning of different interval

• padding Object

指定内边距。

默认值：{ top: 0, bottom: 0 }

格式：

<YAxis padding={{ top: 10 }} />
<YAxis padding={{ bottom: 20 }} />
<YAxis padding={{ top: 20, bottom: 20 }} />

示例：

• XAxis with non-zero padding

• minTickGap Number

两个刻度之前最小间隔宽度。

默认值：5

• allowDecimals Boolean

是否允许小数类型的刻度。

默认值：true

• allowDataOverflow Boolean

当轴是数值轴时，指定轴的定义域（domain）的时候，如果 allowDataOverflow 的值为 false，我们会根据数据的最大值和最小值来调整 domain，确保所有的数据能够展示。如果 allowDataOverflow 的值为 true，不会调整 domain ，而是将相应的图形元素会直接裁剪掉。

默认值：false

• allowDuplicatedCategory Boolean

是否允许类目轴有重复的类目。

默认值：true

• axisLine Boolean | Object

轴线配置。当值为 false 时，不绘制轴线。当值为对象类型时，会把这个对象解析成轴线的属性配置。

默认值：true

• tickLine Boolean | Object

刻度线配置。当值为 false 时，不绘制刻度线。当值为对象类型时，会把这个对象解析成刻度线的属性配置。

默认值：true

• tickSize Number

刻度线的长度。

默认值：6

• tickFormatter Function optional

刻度的格式化函数。

• ticks Array optional

指定需要展示的刻度。

• tick Boolean | Object | ReactElement optional

刻度配置。当值为 false 时，不绘制刻度。当值为对象类型时，会把这个对象解析成刻度的属性配置。当值为 React element，会克隆这个元素来渲染刻度。

格式：

<YAxis tick={false} />
<YAxis tick={{stroke: 'red', strokeWidth: 2}} />
<YAxis tick={<CustomizedTick />} />

• mirror Boolean

如果值为 true , 将刻度展示在轴的内侧，而不是外侧。

默认值：false

• reversed Boolean

是否反转刻度的顺序

默认值：false

• label String | Number | ReactElement | Object optional

当值为简单类型的数值或者字符串时，这个值会被渲染成文字标签。当值为 React element，会克隆这个元素来渲染文字标签。如果一个对象，该选项是一个新的Label实例的道具。

格式：

<YAxis label="Height" />
<YAxis label={<CustomizedLabel />} />
<YAxis label={{ value: "YAxis Label" }} />

示例：

• A composed chart with axis labels

• scale 'auto' | 'linear' | 'pow' | 'sqrt' | 'log' | 'identity' | 'time' | 'band' | 'point' | 'ordinal' | 'quantile' | 'quantize' | 'utc' | 'sequential' | 'threshold' | Function

当值为 "auto" 时，会根据图表类型来生成 scale 函数，也可以传入自定义的函数作为 scale 函数。

默认值：auto

格式：

<YAxis scale="log" />
import { scaleLog } from 'd3-scale';
const scale = scaleLog() .base(Math.E) ;
...
  <YAxis scale={scale} />
...

• unit String | Number optional

y 轴展示数据的单位。这个单位会展示在 Tooltip 的数值后面。

• name String | Number optional

y 轴展示数据的名称。这个单位会展示在 Tooltip 内容中。

• 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 事件的回调函数。

• tickMargin Number optional

刻度线和刻度之间的间隔。