API

图表类型

通用组件

笛卡尔坐标系组件

极坐标系组件

图形

PolarAngleAxis

相关链接

父组件

PolarAngleAxis consumes context provided by these components:

子组件

PolarAngleAxis provides context for these components:

Props

  • allowDataOverflowbooleanoptional

    When domain of the axis is specified and the type of the axis is 'number', if allowDataOverflow is set to be false, the domain will be adjusted when the minimum value of data is smaller than domain[0] or the maximum value of data is greater than domain[1] so that the axis displays all data values. If set to true, graphic elements (line, area, bars) will be clipped to conform to the specified domain.

    默认值：false

  • allowDecimalsbooleanoptional

    默认值：false

  • allowDuplicatedCategorybooleanoptional

    Allow the axis has duplicated categories or not when the type of axis is "category".

    默认值：true

  • anglenumberoptional

    Tick text rotation angle in degrees. Positive values rotate clockwise, negative values rotate counterclockwise.

    默认值：0

  • angleAxisIdnumber | stringoptional

    默认值：0

  • axisLineReact.SVGProps<SVGLineElement> | false | trueoptional

    Controls axis line element. These are be passed as props to SVG <line> element representing the axis line. If true then the axis line is drawn using props of the PolarAngleAxis component. If false then the axis line is not drawn.

    Also see axisLineType prop to change the shape of the axis line.

    默认值：true

    格式：

    <PolarAngleAxis axisLine={{ stroke: 'red', strokeWidth: 2 }} />
<PolarAngleAxis axisLine={false} />
<PolarAngleAxis stroke='red' strokeWidth={2} strokeDasharray={4} />

  • axisLineType"circle" | "polygon"optional

    The type of axis line.

    默认值："polygon"

  • childrenReactNodeoptional

  • classNamestringoptional

    The HTML element's class name

  • cxnumber | stringoptional

    The x-coordinate of center. When used inside a chart context, this prop is calculated based on the chart's dimensions, and this prop is ignored.

    This is only used when rendered outside a chart context.

    默认值：0

  • cynumber | stringoptional

    The y-coordinate of center. When used inside a chart context, this prop is calculated based on the chart's dimensions, and this prop is ignored.

    This is only used when rendered outside a chart context.

    默认值：0

  • dataKeyFunction | number | stringoptional

    Decides how to extract the value of this Axis from the data:

    • string: the name of the field in the data object;
    • number: the index of the field in the data;
    • function: a function that receives the data object and returns the value of this Axis.

    If undefined, it will reuse the dataKey of graphical items.

    示例：

  • domainArray<readonly number> | Array<readonly string> | Function | readonly [AxisDomainItem, AxisDomainItem]optional

    Specify the domain of axis when the axis is a number axis.

    If undefined, then the domain is calculated based on the data and dataKeys.

    The length of domain should be 2, and we will validate the values in domain.

    Each element in the array can be a number, 'auto', 'dataMin', 'dataMax', a string like 'dataMin - 20', 'dataMax + 100', or a function that accepts a single argument and returns a number.

    If any element of domain is set to be 'auto', comprehensible scale ticks will be calculated, and the final domain of axis is generated by the ticks. If a function, receives '[dataMin, dataMax]', and must return a computed domain as '[min, max]'.

    格式：

    <PolarAngleAxis type="number" domain={['dataMin', 'dataMax']} />
<PolarAngleAxis type="number" domain={[0, 'dataMax']} />
<PolarAngleAxis type="number" domain={['auto', 'auto']} />
<PolarAngleAxis type="number" domain={[0, 'dataMax + 1000']} />
<PolarAngleAxis type="number" domain={['dataMin - 100', 'dataMax + 100']} />
<PolarAngleAxis type="number" domain={[dataMin => (0 - Math.abs(dataMin)), dataMax => (dataMax * 2)]} />
<PolarAngleAxis type="number" domain={([dataMin, dataMax]) => { const absMax = Math.max(Math.abs(dataMin), Math.abs(dataMax)); return [-absMax, absMax]; }} />
<PolarAngleAxis type="number" domain={[0, 100]} allowDataOverflow />

  • hidebooleanoptional

    If set true, the axis do not display in the chart.

    默认值：false

  • includeHiddenbooleanoptional

    Ensures that all datapoints within a chart contribute to its domain calculation, even when they are hidden

    默认值：false

  • label(union of 7 variants)optional

    Defines a single label for the whole axis. This prop renders one label in the center of the axis line. Useful for labeling the axis as a whole, like "Time (in seconds)" or "Distance (in meters)".

    This is not controlling tick labels. If you want to customize tick labels, please see tickFormatter or tick props.

    • false: no label is rendered
    • string | number: the content of the label
    • object: the props of LabelList component
    • ReactElement: a custom label element
    • function: a render function of custom label

    默认值：false

  • namestringoptional

    The name of data. This option will be used in tooltip. If no value was set to this option, the value of dataKey will be used alternatively.

  • orientationnumber | stringoptional

    The orientation of axis text.

    默认值："outer"

  • radiusnumber | stringoptional

    The outer radius of circle grid. If set a percentage, the final value is obtained by multiplying the percentage of maxRadius which is calculated by the width, height, cx, cy.

  • rangeAxisRangeoptional@deprecated

    Deprecated: Recharts computes the range automatically based on chart width or height Recharts ignores this prop since 3.0

  • reversedbooleanoptional

    If set to true, the ticks of this axis are reversed.

    默认值：false

  • scale(union of 20 variants)optional

    Scale function determines how data values are mapped to visual values. In other words, decided the mapping between data domain and coordinate range.

    If undefined, or 'auto', the scale function is created internally according to the type of axis and data.

    You can define a custom scale, either as a string shortcut to a d3 scale, or as a complete scale definition object.

    默认值："auto"

    格式：

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

  • tick(union of 5 variants)optional

    Defines how the individual label text is rendered. This controls the settings for individual ticks; on a typical axis, there are multiple ticks, depending on your data.

    If you want to customize the overall axis label, use the label prop instead.

    Options:

    • false: Do not render any tick labels.
    • true: Render tick labels with default settings.
    • object: An object of props to be merged into the internally calculated tick props.
    • ReactElement: A custom React element to be used as the tick label.
    • function: A function that returns a React element for custom rendering of tick labels.

    默认值：true

  • tickCountnumberoptional

    The count of axis ticks. Not used if 'type' is 'category'.

  • tickFormatterFunctionoptional

    The formatter function of ticks.

  • tickLineReact.SVGProps<SVGLineElement> | false | trueoptional

    If false set, tick lines will not be drawn. If true set, tick lines will be drawn which have the props calculated internally. If object set, tick lines will be drawn which have the props merged by the internal calculated props and the option.

    默认值：true

  • ticksArray<readonly TickItem>optional

    The array of every tick's value and angle.

  • tickSizenumberoptional

    The length of tick line.

    默认值：8

  • type"auto" | "category" | "number"optional

    The type of axis.

    category: Treats data as distinct values. Each value is in the same distance from its neighbors, regardless of their actual numeric difference.

    number: Treats data as continuous range. Values that are numerically closer are placed closer together on the axis.

    auto: the type is inferred based on the chart layout.

    默认值："auto"

  • unitstringoptional

    The unit of data. This option will be used in tooltip.

  • zIndexnumberoptional

    Z-Index of this component and its children. The higher the value, the more on top it will be rendered. Components with higher zIndex will appear in front of components with lower zIndex. If undefined or 0, the content is rendered in the default layer without portals.

    默认值：500

    示例：

  • onAbortAdaptChildReactEventHandler<P, T>optional

  • onAbortCaptureAdaptChildReactEventHandler<P, T>optional

  • onAnimationEndAdaptChildAnimationEventHandler<P, T>optional

  • onAnimationEndCaptureAdaptChildAnimationEventHandler<P, T>optional

  • onAnimationIterationAdaptChildAnimationEventHandler<P, T>optional

  • onAnimationIterationCaptureAdaptChildAnimationEventHandler<P, T>optional

  • onAnimationStartAdaptChildAnimationEventHandler<P, T>optional

  • onAnimationStartCaptureAdaptChildAnimationEventHandler<P, T>optional

  • onAuxClickAdaptChildMouseEventHandler<P, T>optional

  • onAuxClickCaptureAdaptChildMouseEventHandler<P, T>optional

  • onBeforeInputAdaptChildFormEventHandler<P, T>optional

  • onBeforeInputCaptureAdaptChildFormEventHandler<P, T>optional

  • onBlurAdaptChildFocusEventHandler<P, T>optional

  • onBlurCaptureAdaptChildFocusEventHandler<P, T>optional

  • onCanPlayAdaptChildReactEventHandler<P, T>optional

  • onCanPlayCaptureAdaptChildReactEventHandler<P, T>optional

  • onCanPlayThroughAdaptChildReactEventHandler<P, T>optional

  • onCanPlayThroughCaptureAdaptChildReactEventHandler<P, T>optional

  • onChangeAdaptChildFormEventHandler<P, T>optional

  • onChangeCaptureAdaptChildFormEventHandler<P, T>optional

  • onClickAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of click on the ticks of this axis

  • onClickCaptureAdaptChildMouseEventHandler<P, T>optional

  • onCompositionEndAdaptChildCompositionEventHandler<P, T>optional

  • onCompositionEndCaptureAdaptChildCompositionEventHandler<P, T>optional

  • onCompositionStartAdaptChildCompositionEventHandler<P, T>optional

  • onCompositionStartCaptureAdaptChildCompositionEventHandler<P, T>optional

  • onCompositionUpdateAdaptChildCompositionEventHandler<P, T>optional

  • onCompositionUpdateCaptureAdaptChildCompositionEventHandler<P, T>optional

  • onContextMenuAdaptChildMouseEventHandler<P, T>optional

  • onContextMenuCaptureAdaptChildMouseEventHandler<P, T>optional

  • onCopyAdaptChildClipboardEventHandler<P, T>optional

  • onCopyCaptureAdaptChildClipboardEventHandler<P, T>optional

  • onCutAdaptChildClipboardEventHandler<P, T>optional

  • onCutCaptureAdaptChildClipboardEventHandler<P, T>optional

  • onDoubleClickAdaptChildMouseEventHandler<P, T>optional

  • onDoubleClickCaptureAdaptChildMouseEventHandler<P, T>optional

  • onDragAdaptChildDragEventHandler<P, T>optional

  • onDragCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragEndAdaptChildDragEventHandler<P, T>optional

  • onDragEndCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragEnterAdaptChildDragEventHandler<P, T>optional

  • onDragEnterCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragExitAdaptChildDragEventHandler<P, T>optional

  • onDragExitCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragLeaveAdaptChildDragEventHandler<P, T>optional

  • onDragLeaveCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragOverAdaptChildDragEventHandler<P, T>optional

  • onDragOverCaptureAdaptChildDragEventHandler<P, T>optional

  • onDragStartAdaptChildDragEventHandler<P, T>optional

  • onDragStartCaptureAdaptChildDragEventHandler<P, T>optional

  • onDropAdaptChildDragEventHandler<P, T>optional

  • onDropCaptureAdaptChildDragEventHandler<P, T>optional

  • onDurationChangeAdaptChildReactEventHandler<P, T>optional

  • onDurationChangeCaptureAdaptChildReactEventHandler<P, T>optional

  • onEmptiedAdaptChildReactEventHandler<P, T>optional

  • onEmptiedCaptureAdaptChildReactEventHandler<P, T>optional

  • onEncryptedAdaptChildReactEventHandler<P, T>optional

  • onEncryptedCaptureAdaptChildReactEventHandler<P, T>optional

  • onEndedAdaptChildReactEventHandler<P, T>optional

  • onEndedCaptureAdaptChildReactEventHandler<P, T>optional

  • onErrorAdaptChildReactEventHandler<P, T>optional

  • onErrorCaptureAdaptChildReactEventHandler<P, T>optional

  • onFocusAdaptChildFocusEventHandler<P, T>optional

  • onFocusCaptureAdaptChildFocusEventHandler<P, T>optional

  • onGotPointerCaptureAdaptChildPointerEventHandler<P, T>optional

  • onGotPointerCaptureCaptureAdaptChildPointerEventHandler<P, T>optional

  • onInputAdaptChildFormEventHandler<P, T>optional

  • onInputCaptureAdaptChildFormEventHandler<P, T>optional

  • onInvalidAdaptChildFormEventHandler<P, T>optional

  • onInvalidCaptureAdaptChildFormEventHandler<P, T>optional

  • onKeyDownAdaptChildKeyboardEventHandler<P, T>optional

  • onKeyDownCaptureAdaptChildKeyboardEventHandler<P, T>optional

  • onKeyPressAdaptChildKeyboardEventHandler<P, T>optional

  • onKeyPressCaptureAdaptChildKeyboardEventHandler<P, T>optional

  • onKeyUpAdaptChildKeyboardEventHandler<P, T>optional

  • onKeyUpCaptureAdaptChildKeyboardEventHandler<P, T>optional

  • onLoadAdaptChildReactEventHandler<P, T>optional

  • onLoadCaptureAdaptChildReactEventHandler<P, T>optional

  • onLoadedDataAdaptChildReactEventHandler<P, T>optional

  • onLoadedDataCaptureAdaptChildReactEventHandler<P, T>optional

  • onLoadedMetadataAdaptChildReactEventHandler<P, T>optional

  • onLoadedMetadataCaptureAdaptChildReactEventHandler<P, T>optional

  • onLoadStartAdaptChildReactEventHandler<P, T>optional

  • onLoadStartCaptureAdaptChildReactEventHandler<P, T>optional

  • onLostPointerCaptureAdaptChildPointerEventHandler<P, T>optional

  • onLostPointerCaptureCaptureAdaptChildPointerEventHandler<P, T>optional

  • onMouseDownAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mousedown on the ticks of this axis

  • onMouseDownCaptureAdaptChildMouseEventHandler<P, T>optional

  • onMouseEnterAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mouseenter on the ticks of this axis

  • onMouseLeaveAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mouseleave on the ticks of this axis

  • onMouseMoveAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mousemove on the ticks of this axis

  • onMouseMoveCaptureAdaptChildMouseEventHandler<P, T>optional

  • onMouseOutAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mouseout on the ticks of this axis

  • onMouseOutCaptureAdaptChildMouseEventHandler<P, T>optional

  • onMouseOverAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mouseover on the ticks of this axis

  • onMouseOverCaptureAdaptChildMouseEventHandler<P, T>optional

  • onMouseUpAdaptChildMouseEventHandler<P, T>optional

    The customized event handler of mouseup on the ticks of this axis

  • onMouseUpCaptureAdaptChildMouseEventHandler<P, T>optional

  • onPasteAdaptChildClipboardEventHandler<P, T>optional

  • onPasteCaptureAdaptChildClipboardEventHandler<P, T>optional

  • onPauseAdaptChildReactEventHandler<P, T>optional

  • onPauseCaptureAdaptChildReactEventHandler<P, T>optional

  • onPlayAdaptChildReactEventHandler<P, T>optional

  • onPlayCaptureAdaptChildReactEventHandler<P, T>optional

  • onPlayingAdaptChildReactEventHandler<P, T>optional

  • onPlayingCaptureAdaptChildReactEventHandler<P, T>optional

  • onPointerCancelAdaptChildPointerEventHandler<P, T>optional

  • onPointerCancelCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerDownAdaptChildPointerEventHandler<P, T>optional

  • onPointerDownCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerEnterAdaptChildPointerEventHandler<P, T>optional

  • onPointerEnterCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerLeaveAdaptChildPointerEventHandler<P, T>optional

  • onPointerLeaveCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerMoveAdaptChildPointerEventHandler<P, T>optional

  • onPointerMoveCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerOutAdaptChildPointerEventHandler<P, T>optional

  • onPointerOutCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerOverAdaptChildPointerEventHandler<P, T>optional

  • onPointerOverCaptureAdaptChildPointerEventHandler<P, T>optional

  • onPointerUpAdaptChildPointerEventHandler<P, T>optional

  • onPointerUpCaptureAdaptChildPointerEventHandler<P, T>optional

  • onProgressAdaptChildReactEventHandler<P, T>optional

  • onProgressCaptureAdaptChildReactEventHandler<P, T>optional

  • onRateChangeAdaptChildReactEventHandler<P, T>optional

  • onRateChangeCaptureAdaptChildReactEventHandler<P, T>optional

  • onResetAdaptChildFormEventHandler<P, T>optional

  • onResetCaptureAdaptChildFormEventHandler<P, T>optional

  • onScrollAdaptChildUIEventHandler<P, T>optional

  • onScrollCaptureAdaptChildUIEventHandler<P, T>optional

  • onSeekedAdaptChildReactEventHandler<P, T>optional

  • onSeekedCaptureAdaptChildReactEventHandler<P, T>optional

  • onSeekingAdaptChildReactEventHandler<P, T>optional

  • onSeekingCaptureAdaptChildReactEventHandler<P, T>optional

  • onSelectAdaptChildReactEventHandler<P, T>optional

  • onSelectCaptureAdaptChildReactEventHandler<P, T>optional

  • onStalledAdaptChildReactEventHandler<P, T>optional

  • onStalledCaptureAdaptChildReactEventHandler<P, T>optional

  • onSubmitAdaptChildFormEventHandler<P, T>optional

  • onSubmitCaptureAdaptChildFormEventHandler<P, T>optional

  • onSuspendAdaptChildReactEventHandler<P, T>optional

  • onSuspendCaptureAdaptChildReactEventHandler<P, T>optional

  • onTimeUpdateAdaptChildReactEventHandler<P, T>optional

  • onTimeUpdateCaptureAdaptChildReactEventHandler<P, T>optional

  • onTouchCancelAdaptChildTouchEventHandler<P, T>optional

  • onTouchCancelCaptureAdaptChildTouchEventHandler<P, T>optional

  • onTouchEndAdaptChildTouchEventHandler<P, T>optional

  • onTouchEndCaptureAdaptChildTouchEventHandler<P, T>optional

  • onTouchMoveAdaptChildTouchEventHandler<P, T>optional

  • onTouchMoveCaptureAdaptChildTouchEventHandler<P, T>optional

  • onTouchStartAdaptChildTouchEventHandler<P, T>optional

  • onTouchStartCaptureAdaptChildTouchEventHandler<P, T>optional

  • onTransitionEndAdaptChildTransitionEventHandler<P, T>optional

  • onTransitionEndCaptureAdaptChildTransitionEventHandler<P, T>optional

  • onVolumeChangeAdaptChildReactEventHandler<P, T>optional

  • onVolumeChangeCaptureAdaptChildReactEventHandler<P, T>optional

  • onWaitingAdaptChildReactEventHandler<P, T>optional

  • onWaitingCaptureAdaptChildReactEventHandler<P, T>optional

  • onWheelAdaptChildWheelEventHandler<P, T>optional

  • onWheelCaptureAdaptChildWheelEventHandler<P, T>optional