recharts

recharts

Version 2.15.0
Published 1 month ago
4.71 MB
8 dependencies
MIT license

Install

npm i recharts

yarn add recharts

pnpm add recharts

Overview

React charts

Index

Variables

variable AreaChart

const AreaChart: any;

variable BarChart

const BarChart: any;

variable Cell

const Cell: FunctionComponent<SVGProps<SVGElement>>;

variable ComposedChart

const ComposedChart: any;

variable Cross

const Cross: React.FC<any>;

variable Curve

const Curve: React.FC<Props>;

variable Dot

const Dot: React.FC<any>;

variable FunnelChart

const FunnelChart: any;

variable Global

const Global: {
    isSsr: boolean;
    get: (key: 'isSsr') => boolean;
    set: (key: GlobalConfigKeys | GlobalConfig, value?: any) => void;
};

variable Layer

const Layer: React.ForwardRefExoticComponent<any>;

variable LineChart

const LineChart: any;

variable PieChart

const PieChart: any;

variable PolarGrid

const PolarGrid: {
    ({
        cx,
        cy,
        innerRadius,
        outerRadius,
        gridType,
        radialLines,
        ...props
    }: Props): React.JSX.Element;
    displayName: string;
};

variable Polygon

const Polygon: React.FC<Props>;

variable RadarChart

const RadarChart: any;

variable RadialBarChart

const RadialBarChart: any;

variable Rectangle

const Rectangle: React.FC<Props>;

variable ResponsiveContainer

const ResponsiveContainer: React.ForwardRefExoticComponent<any>;

variable ScatterChart

const ScatterChart: any;

variable Sector

const Sector: React.FC<any>;

variable Symbols

const Symbols: {
    ({ type, size, sizeType, ...rest }: SymbolsProps): React.JSX.Element;
    registerSymbol: (key: string, factory: D3SymbolType) => void;
};

variable Trapezoid

const Trapezoid: React.FC<any>;

Functions

function CartesianGrid

CartesianGrid: typeof CartesianGrid;

function Customized

Customized: typeof Customized;

custom svg elements by rechart instance props and state.
Returns
{Object} svg elements

function DefaultTooltipContent

DefaultTooltipContent: <TValue extends ValueType, TName extends NameType>(
    props: Props<TValue, TName>
) => React.JSX.Element;

function Label

Label: typeof Label;

function LabelList

LabelList: typeof LabelList;

function SunburstChart

SunburstChart: ({
    className,
    data,
    children,
    width,
    height,
    padding,
    dataKey,
    ringPadding,
    innerRadius,
    fill,
    stroke,
    textOptions,
    outerRadius,
    cx,
    cy,
    startAngle,
    endAngle,
    onClick,
    onMouseEnter,
    onMouseLeave,
}: SunburstChartProps) => React.JSX.Element;

function Surface

Surface: (props: Props) => React.JSX.Element;

function Text

Text: ({
    x: propsX,
    y: propsY,
    lineHeight,
    capHeight,
    scaleToFit,
    textAnchor,
    verticalAnchor,
    fill,
    ...props
}: Props) => React.JSX.Element;

Classes

class Area

class Area extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    stroke: string;
    fill: string;
    fillOpacity: number;
    xAxisId: number;
    yAxisId: number;
    legendType: string;
    connectNulls: boolean;
    points: AreaPointItem[];
    dot: boolean;
    activeDot: boolean;
    hide: boolean;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
};

property displayName

static displayName: string;

property getBaseValue

static getBaseValue: (
    props: Props,
    item: Area,
    xAxis: Props['xAxis'],
    yAxis: Props['yAxis']
) => number;

property getComposedData

static getComposedData: ({
    props,
    item,
    xAxis,
    yAxis,
    xAxisTicks,
    yAxisTicks,
    bandSize,
    dataKey,
    stackedData,
    dataStartIndex,
    displayedData,
    offset,
}: {
    props: Props;
    item: Area;
    bandSize: number;
    xAxis: InternalAreaProps['xAxis'];
    yAxis: InternalAreaProps['yAxis'];
    xAxisTicks: TickItem[];
    yAxisTicks: TickItem[];
    stackedData: number[][];
    dataStartIndex: number;
    offset: ChartOffset;
    displayedData: any[];
    dataKey: Props['dataKey'];
}) => {
    top?: number;
    bottom?: number;
    left?: number;
    right?: number;
    width?: number;
    height?: number;
    brushBottom?: number;
    points: { x: number; y: number; value: any[]; payload: any }[];
    baseLine: number | { x: number; y: number }[];
    layout: 'horizontal' | 'vertical';
    isRange: boolean;
};

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property id

id: string;

property renderDotItem

static renderDotItem: (option: AreaDot, props: any) => React.JSX.Element;

property state

state: State;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method render

render: () => React.JSX.Element;

method renderArea

renderArea: (needClip: boolean, clipPathId: string) => React.JSX.Element;

method renderAreaStatically

renderAreaStatically: (
    points: AreaPointItem[],
    baseLine: Props['baseLine'],
    needClip: boolean,
    clipPathId: string
) => React.JSX.Element;

method renderAreaWithAnimation

renderAreaWithAnimation: (
    needClip: boolean,
    clipPathId: string
) => React.JSX.Element;

method renderClipRect

renderClipRect: (alpha: number) => React.JSX.Element;

method renderDots

renderDots: (
    needClip: boolean,
    clipDot: boolean,
    clipPathId: string
) => React.JSX.Element;

method renderHorizontalRect

renderHorizontalRect: (alpha: number) => React.JSX.Element;

method renderVerticalRect

renderVerticalRect: (alpha: number) => React.JSX.Element;

class Bar

class Bar extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    xAxisId: number;
    yAxisId: number;
    legendType: string;
    minPointSize: number;
    hide: boolean;
    data: BarRectangleItem[];
    layout: string;
    activeBar: boolean;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    props,
    item,
    barPosition,
    bandSize,
    xAxis,
    yAxis,
    xAxisTicks,
    yAxisTicks,
    stackedData,
    dataStartIndex,
    displayedData,
    offset,
}: {
    props: Props;
    item: ReactElement;
    barPosition: any;
    bandSize: number;
    xAxis: InternalBarProps['xAxis'];
    yAxis: InternalBarProps['yAxis'];
    xAxisTicks: TickItem[];
    yAxisTicks: TickItem[];
    stackedData: Array<[number, number]>;
    dataStartIndex: number;
    offset: ChartOffset;
    displayedData: any[];
}) => {
    top?: number;
    bottom?: number;
    left?: number;
    right?: number;
    width?: number;
    height?: number;
    brushBottom?: number;
    data: any[];
    layout: 'horizontal' | 'vertical';
};

Compose the data of each group
Parameter props
Props for the component
Parameter item
An instance of Bar
Parameter barPosition
The offset and size of each bar
Parameter xAxis
The configuration of x-axis
Parameter yAxis
The configuration of y-axis
Parameter stackedData
The stacked data of a bar item @return{Array} Composed data

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property id

id: string;

property state

state: State;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method render

render: () => React.JSX.Element;

method renderBackground

renderBackground: () => React.JSX.Element[];

method renderErrorBar

renderErrorBar: (needClip: boolean, clipPathId: string) => React.JSX.Element;

method renderRectangles

renderRectangles: () => React.JSX.Element | React.JSX.Element[];

method renderRectanglesStatically

renderRectanglesStatically: (data: BarRectangleItem[]) => React.JSX.Element[];

method renderRectanglesWithAnimation

renderRectanglesWithAnimation: () => React.JSX.Element;

class Brush

class Brush extends PureComponent<Props, State> {}

constructor

constructor(props: Props);

property defaultProps

static defaultProps: {
    height: number;
    travellerWidth: number;
    gap: number;
    fill: string;
    stroke: string;
    padding: { top: number; right: number; bottom: number; left: number };
    leaveTimeOut: number;
    alwaysShowText: boolean;
};

property displayName

static displayName: string;

property handleDrag

handleDrag: (
    e: React.Touch | React.MouseEvent<SVGGElement> | MouseEvent
) => void;

property handleDragEnd

handleDragEnd: () => void;

property handleEnterSlideOrTraveller

handleEnterSlideOrTraveller: () => void;

property handleLeaveSlideOrTraveller

handleLeaveSlideOrTraveller: () => void;

property handleLeaveWrapper

handleLeaveWrapper: () => void;

property handleSlideDragStart

handleSlideDragStart: (
    e: TouchEvent<SVGRectElement> | React.MouseEvent<SVGRectElement>
) => void;

property handleTouchMove

handleTouchMove: (e: TouchEvent<SVGGElement>) => void;

property leaveTimer

leaveTimer?: number;

property travellerDragStartHandlers

travellerDragStartHandlers?: Record<
    BrushTravellerId,
    (event: React.MouseEvent<SVGGElement> | TouchEvent<SVGGElement>) => void
>;

method attachDragEndListener

attachDragEndListener: () => void;

method componentWillUnmount

componentWillUnmount: () => void;

method detachDragEndListener

detachDragEndListener: () => void;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method getIndex

getIndex: ({ startX, endX }: { startX: number; endX: number }) => {
    startIndex: number;
    endIndex: number;
};

method getIndexInRange

static getIndexInRange: (valueRange: number[], x: number) => number;

method getTextOfTick

getTextOfTick: (index: number) => any;

method handleSlideDrag

handleSlideDrag: (
    e: React.Touch | React.MouseEvent<SVGGElement> | MouseEvent
) => void;

method handleTravellerDragStart

handleTravellerDragStart: (
    id: BrushTravellerId,
    e: React.MouseEvent<SVGGElement> | TouchEvent<SVGGElement>
) => void;

method handleTravellerMove

handleTravellerMove: (
    e: React.Touch | React.MouseEvent<SVGGElement> | MouseEvent
) => void;

method handleTravellerMoveKeyboard

handleTravellerMoveKeyboard: (direction: 1 | -1, id: BrushTravellerId) => void;

method render

render: () => React.JSX.Element;

method renderBackground

renderBackground: () => React.JSX.Element;

method renderDefaultTraveller

static renderDefaultTraveller: (props: any) => React.JSX.Element;

method renderPanorama

renderPanorama: () => React.ReactElement<any, any>;

method renderSlide

renderSlide: (startX: number, endX: number) => React.JSX.Element;

method renderText

renderText: () => React.JSX.Element;

method renderTraveller

static renderTraveller: (
    option: BrushTravellerType,
    props: any
) => React.JSX.Element;

method renderTravellerLayer

renderTravellerLayer: (
    travellerX: number,
    id: BrushTravellerId
) => React.JSX.Element;

class CartesianAxis

class CartesianAxis extends Component<Props, IState> {}

constructor

constructor(props: Props);

property defaultProps

static defaultProps: {
    x: number;
    y: number;
    width: number;
    height: number;
    viewBox: { x: number; y: number; width: number; height: number };
    orientation: string;
    ticks: CartesianTickItem[];
    stroke: string;
    tickLine: boolean;
    axisLine: boolean;
    tick: boolean;
    mirror: boolean;
    minTickGap: number;
    tickSize: number;
    tickMargin: number;
    interval: string;
};

property displayName

static displayName: string;

method componentDidMount

componentDidMount: () => void;

method getTickLineCoord

getTickLineCoord: (data: CartesianTickItem) => {
    line: { x1: number; y1: number; x2: number; y2: number };
    tick: { x: number; y: number };
};

Calculate the coordinates of endpoints in ticks
Parameter data
The data of a simple tick {Object} (x1, y1): The coordinate of endpoint close to tick text (x2, y2): The coordinate of endpoint close to axis

method getTickTextAnchor

getTickTextAnchor: () => string;

method getTickVerticalAnchor

getTickVerticalAnchor: () => string;

method render

render: () => React.JSX.Element;

method renderAxisLine

renderAxisLine: () => React.JSX.Element;

method renderTickItem

static renderTickItem: (
    option: Props['tick'],
    props: any,
    value: ReactNode
) => React.JSX.Element;

method renderTicks

renderTicks: (
    ticks: CartesianTickItem[],
    fontSize: string,
    letterSpacing: string
) => React.JSX.Element;

render the ticks
Parameter ticks
The ticks to actually render (overrides what was passed in props)
Parameter fontSize
Fontsize to consider for tick spacing
Parameter letterSpacing
Letterspacing to consider for tick spacing {ReactComponent} renderedTicks

method shouldComponentUpdate

shouldComponentUpdate: (
    { viewBox, ...restProps }: Props,
    nextState: IState
) => boolean;

class DefaultLegendContent

class DefaultLegendContent extends PureComponent<Props> {}

property defaultProps

static defaultProps: {
    iconSize: number;
    layout: string;
    align: string;
    verticalAlign: string;
    inactiveColor: string;
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

method renderIcon

renderIcon: (data: Payload) => React.JSX.Element;

Render the path of icon
Parameter data
Data of each legend item {String} Path element

method renderItems

renderItems: () => React.JSX.Element[];

Draw items of legend {ReactElement} Items

class ErrorBar

class ErrorBar extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    stroke: string;
    strokeWidth: number;
    width: number;
    offset: number;
    layout: string;
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

class Funnel

class Funnel extends PureComponent<FunnelProps, State> {}

property defaultProps

static defaultProps: {
    stroke: string;
    fill: string;
    legendType: string;
    labelLine: boolean;
    hide: boolean;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
    nameKey: string;
    lastShapeType: string;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    item,
    offset,
}: {
    item: Funnel;
    offset: ChartOffset;
}) => {
    trapezoids: {
        payload: any;
        parentViewBox: { x: number; y: number; width: number; height: number };
        labelViewBox: { x: number; y: number; width: number; height: number };
        x: number;
        y: number;
        width: number;
        upperWidth: number;
        lowerWidth: number;
        height: number;
        name: any;
        val: any;
        tooltipPayload: {
            name: any;
            value: any;
            payload: any;
            dataKey: DataKey<any>;
            type: 'none';
        }[];
        tooltipPosition: { x: number; y: number };
    }[];
    data: any[];
};

property getRealFunnelData

static getRealFunnelData: (item: Funnel) => any[];

property getRealWidthHeight

static getRealWidthHeight: (
    item: Funnel,
    offset: ChartOffset
) => { realWidth: number; realHeight: number; offsetX: number; offsetY: number };

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property state

state: State;

method getDerivedStateFromProps

static getDerivedStateFromProps: (
    nextProps: FunnelProps,
    prevState: State
) => State;

method isActiveIndex

isActiveIndex: (i: number) => boolean;

method render

render: () => React.JSX.Element;

method renderTrapezoids

renderTrapezoids: () => React.JSX.Element | React.JSX.Element[];

method renderTrapezoidsStatically

renderTrapezoidsStatically: (
    trapezoids: FunnelTrapezoidItem[]
) => React.JSX.Element[];

method renderTrapezoidsWithAnimation

renderTrapezoidsWithAnimation: () => React.JSX.Element;

class Legend

class Legend extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    iconSize: number;
    layout: string;
    align: string;
    verticalAlign: string;
};

property displayName

static displayName: string;

property lastBoundingBox

lastBoundingBox: { width: number; height: number };

method componentDidMount

componentDidMount: () => void;

method componentDidUpdate

componentDidUpdate: () => void;

method getBBox

getBBox: () => DOMRect;

method getWithHeight

static getWithHeight: (
    item: { props: { layout?: LayoutType; height?: number; width?: number } },
    chartWidth: number
) => null | { height: number } | { width: number };

method render

render: () => React.JSX.Element;

class Line

class Line extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    xAxisId: number;
    yAxisId: number;
    connectNulls: boolean;
    activeDot: boolean;
    dot: boolean;
    legendType: string;
    stroke: string;
    strokeWidth: number;
    fill: string;
    points: LinePointItem[];
    isAnimationActive: boolean;
    animateNewValues: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
    hide: boolean;
    label: boolean;
};

property displayName

static displayName: string;

property generateSimpleStrokeDasharray

generateSimpleStrokeDasharray: (totalLength: number, length: number) => string;

property getComposedData

static getComposedData: ({
    props,
    xAxis,
    yAxis,
    xAxisTicks,
    yAxisTicks,
    dataKey,
    bandSize,
    displayedData,
    offset,
}: {
    props: Props;
    xAxis: Props['xAxis'];
    yAxis: Props['yAxis'];
    xAxisTicks: TickItem[];
    yAxisTicks: TickItem[];
    dataKey: Props['dataKey'];
    bandSize: number;
    displayedData: any[];
    offset: ChartOffset;
}) => {
    top?: number;
    bottom?: number;
    left?: number;
    right?: number;
    width?: number;
    height?: number;
    brushBottom?: number;
    points: { x: number; y: number; value: any; payload: any }[];
    layout: 'horizontal' | 'vertical';
};

Compose the data of each group
Parameter props
The props from the component
Parameter xAxis
The configuration of x-axis
Parameter yAxis
The configuration of y-axis
Parameter dataKey
The unique key of a group {Array} Composed data

property getStrokeDasharray

getStrokeDasharray: (
    length: number,
    totalLength: number,
    lines: number[]
) => string;

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property id

id: string;

property mainCurve

mainCurve?: SVGPathElement;

property pathRef

pathRef: (node: SVGPathElement) => void;

property state

state: State;

method componentDidMount

componentDidMount: () => void;

method componentDidUpdate

componentDidUpdate: () => void;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method getTotalLength

getTotalLength: () => number;

method render

render: () => React.JSX.Element;

method renderCurve

renderCurve: (needClip: boolean, clipPathId: string) => React.JSX.Element;

method renderCurveStatically

renderCurveStatically: (
    points: LinePointItem[],
    needClip: boolean,
    clipPathId: string,
    props?: { strokeDasharray: string }
) => React.JSX.Element;

method renderCurveWithAnimation

renderCurveWithAnimation: (
    needClip: boolean,
    clipPathId: string
) => React.JSX.Element;

method renderDotItem

static renderDotItem: (option: LineDot, props: any) => React.JSX.Element;

method renderDots

renderDots: (
    needClip: boolean,
    clipDot: boolean,
    clipPathId: string
) => React.JSX.Element;

method renderErrorBar

renderErrorBar: (needClip: boolean, clipPathId: string) => React.JSX.Element;

method repeat

static repeat: (lines: number[], count: number) => number[];

class Pie

class Pie extends PureComponent<Props, State> {}

constructor

constructor(props: any);

property defaultProps

static defaultProps: {
    stroke: string;
    fill: string;
    legendType: string;
    cx: string;
    cy: string;
    startAngle: number;
    endAngle: number;
    innerRadius: number;
    outerRadius: string;
    paddingAngle: number;
    labelLine: boolean;
    hide: boolean;
    minAngle: number;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
    nameKey: string;
    blendStroke: boolean;
    rootTabIndex: number;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    item,
    offset,
}: {
    item: React.ReactElement<any>;
    offset: ChartOffset;
}) => Omit<Props, 'dataKey'>;

property getRealPieData

static getRealPieData: (itemProps: Props) => any[];

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property id

id: string;

property parseCoordinateOfPie

static parseCoordinateOfPie: (
    itemProps: Props,
    offset: ChartOffset
) => {
    cx: number;
    cy: number;
    innerRadius: number;
    outerRadius: number;
    maxRadius: number;
};

property parseDeltaAngle

static parseDeltaAngle: (startAngle: number, endAngle: number) => number;

property pieRef

pieRef: SVGGElement;

property sectorRefs

sectorRefs: SVGGElement[];

property state

state: State;

method attachKeyboardHandlers

attachKeyboardHandlers: (pieRef: SVGGElement) => void;

method componentDidMount

componentDidMount: () => void;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method getTextAnchor

static getTextAnchor: (x: number, cx: number) => 'start' | 'middle' | 'end';

method hasActiveIndex

hasActiveIndex: () => number | boolean;

method isActiveIndex

isActiveIndex: (i: number) => boolean;

method render

render: () => React.JSX.Element;

method renderLabelItem

static renderLabelItem: (
    option: PieLabel,
    props: any,
    value: any
) => React.JSX.Element;

method renderLabelLineItem

static renderLabelLineItem: (
    option: PieLabelLine,
    props: any,
    key: string
) => React.JSX.Element;

method renderLabels

renderLabels: (sectors: PieSectorDataItem[]) => React.JSX.Element;

method renderSectors

renderSectors: () => React.JSX.Element | React.JSX.Element[];

method renderSectorsStatically

renderSectorsStatically: (sectors: PieSectorDataItem[]) => React.JSX.Element[];

method renderSectorsWithAnimation

renderSectorsWithAnimation: () => React.JSX.Element;

class PolarAngleAxis

class PolarAngleAxis extends PureComponent<Props> {}

property axisType

static axisType: string;

property defaultProps

static defaultProps: {
    type: string;
    angleAxisId: number;
    scale: string;
    cx: number;
    cy: number;
    orientation: string;
    axisLine: boolean;
    tickLine: boolean;
    tickSize: number;
    tick: boolean;
    hide: boolean;
    allowDuplicatedCategory: boolean;
};

property displayName

static displayName: string;

method getTickLineCoord

getTickLineCoord: (data: TickItem) => {
    x1: number;
    y1: number;
    x2: number;
    y2: number;
};

Calculate the coordinate of line endpoint
Parameter data
The Data if ticks {Object} (x0, y0): The start point of text, (x1, y1): The end point close to text, (x2, y2): The end point close to axis

method getTickTextAnchor

getTickTextAnchor: (data: TickItem) => string;

Get the text-anchor of each tick
Parameter data
Data of ticks {String} text-anchor

method render

render: () => React.JSX.Element;

method renderAxisLine

renderAxisLine: () => React.JSX.Element;

method renderTickItem

static renderTickItem: (
    option: PolarAngleAxisProps['tick'],
    props: any,
    value: string | number
) => React.JSX.Element;

method renderTicks

renderTicks: () => React.JSX.Element;

class PolarRadiusAxis

class PolarRadiusAxis extends PureComponent<Props> {}

property axisType

static axisType: string;

property defaultProps

static defaultProps: {
    type: string;
    radiusAxisId: number;
    cx: number;
    cy: number;
    angle: number;
    orientation: string;
    stroke: string;
    axisLine: boolean;
    tick: boolean;
    tickCount: number;
    allowDataOverflow: boolean;
    scale: string;
    allowDuplicatedCategory: boolean;
};

property displayName

static displayName: string;

method getTickTextAnchor

getTickTextAnchor: () => string;

method getTickValueCoord

getTickValueCoord: ({
    coordinate,
}: TickItem) => import('../util/types').Coordinate;

Calculate the coordinate of tick
Parameter coordinate
The radius of tick {Object} (x, y)

method getViewBox

getViewBox: () => {
    cx: number;
    cy: number;
    startAngle: number;
    endAngle: number;
    innerRadius: number;
    outerRadius: number;
};

method render

render: () => React.JSX.Element;

method renderAxisLine

renderAxisLine: () => React.JSX.Element;

method renderTickItem

static renderTickItem: (
    option: Props['tick'],
    props: any,
    value: string | number
) => React.JSX.Element;

method renderTicks

renderTicks: () => React.JSX.Element;

class Radar

class Radar extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    angleAxisId: number;
    radiusAxisId: number;
    hide: boolean;
    activeDot: boolean;
    dot: boolean;
    legendType: string;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    radiusAxis,
    angleAxis,
    displayedData,
    dataKey,
    bandSize,
}: {
    radiusAxis: RadiusAxis;
    angleAxis: AngleAxis;
    displayedData: any[];
    dataKey: RadarProps['dataKey'];
    bandSize: number;
}) => { points: RadarPoint[]; isRange: boolean; baseLinePoints: RadarPoint[] };

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property handleMouseEnter

handleMouseEnter: (e: MouseEvent<SVGPolygonElement>) => void;

property handleMouseLeave

handleMouseLeave: (e: MouseEvent<SVGPolygonElement>) => void;

property state

state: State;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method render

render: () => React.JSX.Element;

method renderDotItem

static renderDotItem: (option: RadarDot, props: any) => React.JSX.Element;

method renderDots

renderDots: (points: RadarPoint[]) => React.JSX.Element;

method renderPolygon

renderPolygon: () => React.JSX.Element;

method renderPolygonStatically

renderPolygonStatically: (points: RadarPoint[]) => React.JSX.Element;

method renderPolygonWithAnimation

renderPolygonWithAnimation: () => React.JSX.Element;

class RadialBar

class RadialBar extends PureComponent<RadialBarProps, State> {}

property defaultProps

static defaultProps: {
    angleAxisId: number;
    radiusAxisId: number;
    minPointSize: number;
    hide: boolean;
    legendType: string;
    data: RadialBarDataItem[];
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
    forceCornerRadius: boolean;
    cornerIsExternal: boolean;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    item,
    props,
    radiusAxis,
    radiusAxisTicks,
    angleAxis,
    angleAxisTicks,
    displayedData,
    dataKey,
    stackedData,
    barPosition,
    bandSize,
    dataStartIndex,
}: {
    item: ReactElement;
    props: any;
    radiusAxis: any;
    radiusAxisTicks: Array<TickItem>;
    angleAxis: any;
    angleAxisTicks: Array<TickItem>;
    displayedData: any[];
    dataKey: RadialBarProps['dataKey'];
    stackedData?: any[];
    barPosition?: any[];
    bandSize?: number;
    dataStartIndex: number;
}) => { data: any[]; layout: any };

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property state

state: State;

method getDeltaAngle

getDeltaAngle: () => number;

method getDerivedStateFromProps

static getDerivedStateFromProps: (
    nextProps: RadialBarProps,
    prevState: State
) => State;

method render

render: () => React.JSX.Element;

method renderBackground

renderBackground: (sectors?: RadialBarDataItem[]) => React.JSX.Element[];

method renderSectors

renderSectors: () => React.JSX.Element | React.JSX.Element[];

method renderSectorsStatically

renderSectorsStatically: (sectors: SectorProps[]) => React.JSX.Element[];

method renderSectorsWithAnimation

renderSectorsWithAnimation: () => React.JSX.Element;

class ReferenceArea

class ReferenceArea extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    isFront: boolean;
    ifOverflow: string;
    xAxisId: number;
    yAxisId: number;
    r: number;
    fill: string;
    fillOpacity: number;
    stroke: string;
    strokeWidth: number;
};

property displayName

static displayName: string;

property renderRect

static renderRect: (
    option: ReferenceAreaProps['shape'],
    props: any
) => React.JSX.Element;

method render

render: () => React.JSX.Element;

class ReferenceDot

class ReferenceDot extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    isFront: boolean;
    ifOverflow: string;
    xAxisId: number;
    yAxisId: number;
    r: number;
    fill: string;
    stroke: string;
    fillOpacity: number;
    strokeWidth: number;
};

property displayName

static displayName: string;

property renderDot

static renderDot: (option: Props['shape'], props: any) => React.JSX.Element;

method render

render: () => React.JSX.Element;

class ReferenceLine

class ReferenceLine extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    isFront: boolean;
    ifOverflow: string;
    xAxisId: number;
    yAxisId: number;
    fill: string;
    stroke: string;
    fillOpacity: number;
    strokeWidth: number;
    position: string;
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

class Sankey

class Sankey extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    nameKey: string;
    dataKey: string;
    nodePadding: number;
    nodeWidth: number;
    linkCurvature: number;
    iterations: number;
    margin: { top: number; right: number; bottom: number; left: number };
    sort: boolean;
};

property displayName

static displayName: string;

property state

state: {
    activeElement: any;
    activeElementType: any;
    isTooltipActive: boolean;
    nodes: SankeyNode[];
    links: SankeyLink[];
};

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method handleClick

handleClick: (el: React.ReactElement, type: string, e: any) => void;

method handleMouseEnter

handleMouseEnter: (el: React.ReactElement, type: string, e: any) => void;

method handleMouseLeave

handleMouseLeave: (el: React.ReactElement, type: string, e: any) => void;

method render

render: () => React.JSX.Element;

method renderLinkItem

static renderLinkItem: (option: any, props: any) => any;

method renderLinks

renderLinks: (links: SankeyLink[], nodes: SankeyNode[]) => React.JSX.Element;

method renderNodeItem

static renderNodeItem: (option: any, props: Props) => any;

method renderNodes

renderNodes: (nodes: SankeyNode[]) => React.JSX.Element;

method renderTooltip

renderTooltip: () => ReactElement;

class Scatter

class Scatter extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    xAxisId: number;
    yAxisId: number;
    zAxisId: number;
    legendType: string;
    lineType: string;
    lineJointType: string;
    data: any[];
    shape: string;
    hide: boolean;
    isAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
};

property displayName

static displayName: string;

property getComposedData

static getComposedData: ({
    xAxis,
    yAxis,
    zAxis,
    item,
    displayedData,
    xAxisTicks,
    yAxisTicks,
    offset,
}: {
    props: Props;
    xAxis: Props['xAxis'];
    yAxis: Props['yAxis'];
    zAxis: Props['zAxis'];
    xAxisTicks: TickItem[];
    yAxisTicks: TickItem[];
    item: Scatter;
    bandSize: number;
    displayedData: any[];
    offset: ChartOffset;
}) => {
    top?: number;
    bottom?: number;
    left?: number;
    right?: number;
    width?: number;
    height?: number;
    brushBottom?: number;
    points: any[];
};

Compose the data of each group
Parameter xAxis
The configuration of x-axis
Parameter yAxis
The configuration of y-axis
Parameter dataKey
The unique key of a group {Array} Composed data

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property id

id: string;

property state

state: State;

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method render

render: () => React.JSX.Element;

method renderErrorBar

renderErrorBar: () => React.ReactElement<
    ErrorBarProps,
    string | React.JSXElementConstructor<any>
>[];

method renderLine

renderLine: () => React.JSX.Element;

method renderSymbols

renderSymbols: () => React.JSX.Element | React.JSX.Element[];

method renderSymbolsStatically

renderSymbolsStatically: (points: ScatterPointItem[]) => React.JSX.Element[];

method renderSymbolsWithAnimation

renderSymbolsWithAnimation: () => React.JSX.Element;

class Tooltip<
    TValue extends ValueType,
    TName extends NameType
> extends PureComponent<TooltipProps<TValue, TName>> {}

property defaultProps

static defaultProps: {
    accessibilityLayer: boolean;
    allowEscapeViewBox: { x: boolean; y: boolean };
    animationDuration: number;
    animationEasing: string;
    contentStyle: {};
    coordinate: { x: number; y: number };
    cursor: boolean;
    cursorStyle: {};
    filterNull: boolean;
    isAnimationActive: boolean;
    itemStyle: {};
    labelStyle: {};
    offset: number;
    reverseDirection: { x: boolean; y: boolean };
    separator: string;
    trigger: string;
    useTranslate3d: boolean;
    viewBox: { x: number; y: number; height: number; width: number };
    wrapperStyle: {};
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

class Treemap

class Treemap extends PureComponent<Props, State> {}

property defaultProps

static defaultProps: {
    aspectRatio: number;
    dataKey: string;
    type: string;
    isAnimationActive: boolean;
    isUpdateAnimationActive: boolean;
    animationBegin: number;
    animationDuration: number;
    animationEasing: string;
};

property displayName

static displayName: string;

property handleAnimationEnd

handleAnimationEnd: () => void;

property handleAnimationStart

handleAnimationStart: () => void;

property state

state: {
    isTooltipActive: boolean;
    isAnimationFinished: boolean;
    activeNode?: TreemapNode;
    formatRoot?: TreemapNode;
    currentRoot?: TreemapNode;
    nestIndex?: TreemapNode[];
    prevData?: any[];
    prevType?: 'flat' | 'nest';
    prevWidth?: number;
    prevHeight?: number;
    prevDataKey?: DataKey<any>;
    prevAspectRatio?: number;
};

method getDerivedStateFromProps

static getDerivedStateFromProps: (nextProps: Props, prevState: State) => State;

method handleClick

handleClick: (node: TreemapNode) => void;

method handleMouseEnter

handleMouseEnter: (node: TreemapNode, e: any) => void;

method handleMouseLeave

handleMouseLeave: (node: TreemapNode, e: any) => void;

method handleNestIndex

handleNestIndex: (node: TreemapNode, i: number) => void;

method render

render: () => React.JSX.Element;

method renderAllNodes

renderAllNodes: () => React.ReactElement;

method renderContentItem

static renderContentItem: (
    content: any,
    nodeProps: TreemapNode,
    type: string,
    colorPanel: string[]
) => React.ReactElement;

method renderItem

renderItem: (
    content: any,
    nodeProps: TreemapNode,
    isLeaf: boolean
) => React.ReactElement;

method renderNestIndex

renderNestIndex: () => React.ReactElement;

method renderNode

renderNode: (root: TreemapNode, node: TreemapNode) => React.ReactElement;

method renderTooltip

renderTooltip: () => React.ReactElement;

class XAxis

class XAxis extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    allowDecimals: boolean;
    hide: boolean;
    orientation: string;
    width: number;
    height: number;
    mirror: boolean;
    xAxisId: number;
    tickCount: number;
    type: string;
    padding: { left: number; right: number };
    allowDataOverflow: boolean;
    scale: string;
    reversed: boolean;
    allowDuplicatedCategory: boolean;
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

class YAxis

class YAxis extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    allowDuplicatedCategory: boolean;
    allowDecimals: boolean;
    hide: boolean;
    orientation: string;
    width: number;
    height: number;
    mirror: boolean;
    yAxisId: number;
    tickCount: number;
    type: string;
    padding: { top: number; bottom: number };
    allowDataOverflow: boolean;
    scale: string;
    reversed: boolean;
};

property displayName

static displayName: string;

method render

render: () => React.JSX.Element;

class ZAxis

class ZAxis extends React.Component<Props> {}

property defaultProps

static defaultProps: {
    zAxisId: number;
    range: number[];
    scale: string;
    type: string;
};

property displayName

static displayName: string;

method render

render: () => React.ReactNode;

Interfaces

interface DefaultTooltipContentProps

interface Props<TValue extends ValueType, TName extends NameType> {}

property accessibilityLayer

accessibilityLayer?: boolean;

property contentStyle

contentStyle?: CSSProperties;

property formatter

formatter?: Formatter<TValue, TName>;

property itemSorter

itemSorter?: (item: Payload<TValue, TName>) => number | string;

property itemStyle

itemStyle?: CSSProperties;

property label

label?: any;

property labelClassName

labelClassName?: string;

property labelFormatter

labelFormatter?: (
    label: any,
    payload: Array<Payload<TValue, TName>>
) => ReactNode;

property labelStyle

labelStyle?: CSSProperties;

property payload

payload?: Array<Payload<TValue, TName>>;

property separator

separator?: string;

property wrapperClassName

wrapperClassName?: string;

interface PieLabelRenderProps

interface PieLabelRenderProps extends PieDef {}

property index

index?: number;

property name

name: string;

property percent

percent?: number;

property stroke

stroke: string;

property textAnchor

textAnchor: string;

property x

x: number;

property y

y: number;

index signature

[key: string]: any;

interface ResponsiveContainerProps

interface Props {}

property aspect

aspect?: number;

property children

children: ReactElement;

property className

className?: string | number;

property debounce

debounce?: number;

property height

height?: string | number;

property id

id?: string | number;

property initialDimension

initialDimension?: {
    width: number;
    height: number;
};

property maxHeight

maxHeight?: number;

property minHeight

minHeight?: string | number;

property minWidth

minWidth?: string | number;

property onResize

onResize?: (width: number, height: number) => void;

property style

style?: Omit<CSSProperties, keyof Props>;

property width

width?: string | number;

interface TreemapProps

interface Props {}

property animationBegin

animationBegin?: number;

property animationDuration

animationDuration?: AnimationDuration;

property animationEasing

animationEasing?: AnimationTiming;

property animationId

animationId?: number;

property aspectRatio

aspectRatio?: number;

property children

children?: any;

property className

className?: string;

property colorPanel

colorPanel?: [];

property content

content?: React.ReactElement;

property data

data?: any[];

property dataKey

dataKey?: DataKey<any>;

property fill

fill?: string;

property height

height?: number;

property isAnimationActive

isAnimationActive?: boolean;

property isUpdateAnimationActive

isUpdateAnimationActive?: boolean;

property nameKey

nameKey?: DataKey<any>;

property nestIndexContent

nestIndexContent?: React.ReactElement | ((item: any, i: number) => any);

property onAnimationEnd

onAnimationEnd?: () => void;

property onAnimationStart

onAnimationStart?: () => void;

property onClick

onClick?: (node: TreemapNode) => void;

property onMouseEnter

onMouseEnter?: (node: TreemapNode, e: any) => void;

property onMouseLeave

onMouseLeave?: (node: TreemapNode, e: any) => void;

property stroke

stroke?: string;

property style

style?: any;

property type

type?: 'flat' | 'nest';

property width

width?: number;

interface ZAxisProps

interface Props {}

property dataKey

dataKey?: DataKey<any>;

The key of data displayed in the axis

property domain

domain?: AxisDomain;

The domain of scale in this axis

property name

name?: string | number;

The name of data displayed in the axis

property range

range?: number[];

The range of axis

property scale

scale?: ScaleType | Function;

property type

type?: 'number' | 'category';

property unit

unit?: string | number;

The unit of data displayed in the axis

property zAxisId

zAxisId?: string | number;

The unique id of z-axis

Type Aliases

type AreaProps

type Props = Omit<SVGProps<SVGElement>, 'type' | 'points'> & AreaProps;

type BarProps

type Props = Omit<
    PresentationAttributesAdaptChildEvent<any, SVGPathElement>,
    'radius' | 'name'
> &
    BarProps;

type BrushProps

type Props = Omit<SVGProps<SVGElement>, 'onChange'> & BrushProps;

type CartesianAxisProps

type Props = Omit<
    PresentationAttributesAdaptChildEvent<any, SVGElement>,
    'viewBox'
> &
    CartesianAxisProps;

type CartesianGridProps

type Props = AcceptedSvgProps & CartesianGridProps;

type CellProps

type Props = SVGProps<SVGElement>;

type CrossProps

type Props = SVGProps<SVGPathElement> & CrossProps;

type CurveProps

type Props = Omit<
    PresentationAttributesWithProps<CurveProps, SVGPathElement>,
    'type' | 'points'
> &
    CurveProps;

type CustomizedProps

type Props<P, C extends Comp<P>> = P & {
    component: C;
};

type DefaultLegendContentProps

type Props = InternalProps &
    Omit<
        PresentationAttributesAdaptChildEvent<any, ReactElement>,
        keyof InternalProps
    >;

type DotProps

type Props = PresentationAttributesWithProps<DotProps, SVGCircleElement> & DotProps;

type ErrorBarProps

type Props = SVGProps<SVGLineElement> & ErrorBarProps;

type FunnelProps

type FunnelProps = PresentationAttributesAdaptChildEvent<any, SVGElement> &
    TrapezoidProps &
    InternalFunnelProps;

type LabelListProps

type Props<T extends Data> = SVGProps<SVGTextElement> & LabelListProps<T>;

type LabelProps

type Props = Omit<SVGProps<SVGTextElement>, 'viewBox'> & LabelProps;

type LayerProps

type Props = SVGAttributes<SVGGElement> & LayerProps;

type LegendProps

type Props = DefaultProps & {
    wrapperStyle?: CSSProperties;
    chartWidth?: number;
    chartHeight?: number;
    width?: number;
    height?: number;
    margin?: {
        top?: number;
        left?: number;
        bottom?: number;
        right?: number;
    };
    payloadUniqBy?: UniqueOption<Payload>;
    onBBoxUpdate?: (box: DOMRect | null) => void;
};

type LegendType

type LegendType =
    | 'plainline'
    | 'line'
    | 'square'
    | 'rect'
    | 'circle'
    | 'cross'
    | 'diamond'
    | 'star'
    | 'triangle'
    | 'wye'
    | 'none';

type LineProps

type Props = Omit<CurveProps, 'points' | 'pathRef'> & LineProps;

type PieLabel

type PieLabel<P = any> =
    | ReactElement<SVGElement>
    | ((props: P) => ReactNode | ReactElement<SVGElement>)
    | (SVGProps<SVGTextElement> & {
          offsetRadius?: number;
      })
    | boolean;

type PieProps

type Props = PresentationAttributesAdaptChildEvent<any, SVGElement> & PieProps;

type PolarAngleAxisProps

type Props = PresentationAttributesAdaptChildEvent<any, SVGTextElement> &
    PolarAngleAxisProps;

type PolarGridProps

type Props = SVGProps<SVGPathElement> & PolarGridProps;

type PolarRadiusAxisProps

type Props = PresentationAttributesAdaptChildEvent<any, SVGElement> &
    PolarRadiusAxisProps;

type PolygonProps

type Props = Omit<SVGProps<SVGPolygonElement>, 'points'> & PolygonProps;

type RadarProps

type Props = Omit<SVGProps<SVGElement>, 'onMouseEnter' | 'onMouseLeave' | 'points'> &
    RadarProps;

type RadialBarProps

type RadialBarProps = PresentationAttributesAdaptChildEvent<any, SVGElement> &
    InternalRadialBarProps;

type RectangleProps

type Props = Omit<SVGProps<SVGPathElement>, 'radius'> & RectangleProps;

type ReferenceAreaProps

type Props = RectangleProps & ReferenceAreaProps;

type ReferenceDotProps

type Props = DotProps & ReferenceDotProps;

type ReferenceLineProps

type Props = Omit<SVGProps<SVGLineElement>, 'viewBox'> & ReferenceLineProps;

This excludes viewBox prop from svg for two reasons: 1. The components wants viewBox of object type, and svg wants string - so there's a conflict, and the component will throw if it gets string 2. Internally the component calls filterProps which filters the viewBox away anyway

type ScatterProps

type Props = PresentationAttributesAdaptChildEvent<any, SVGElement> & ScatterProps;

type SectorProps

type Props = SVGProps<SVGPathElement> & SectorProps;

type SurfaceProps

type Props = Omit<SVGProps<SVGSVGElement>, 'viewBox'> & SurfaceProps;

type SymbolsProps

type SymbolsProps = SVGProps<SVGPathElement> & InnerSymbolsProp;

type TextProps

type Props = Omit<SVGProps<SVGTextElement>, 'textAnchor' | 'verticalAnchor'> &
    TextProps;

type TooltipProps

type TooltipProps<
    TValue extends ValueType,
    TName extends NameType
> = ToltipContentProps<TValue, TName> & {
    accessibilityLayer?: boolean;
    /**
     * If true, then Tooltip is always displayed, once an activeIndex is set by mouse over, or programmatically.
     * If false, then Tooltip is never displayed.
     * If active is undefined, Recharts will control when the Tooltip displays. This includes mouse and keyboard controls.
     */
    active?: boolean | undefined;
    /**
     * If true, then Tooltip will information about hidden series (defaults to false). Interacting with the hide property of Area, Bar, Line, Scatter.
     */
    includeHidden?: boolean | undefined;
    allowEscapeViewBox?: AllowInDimension;
    animationDuration?: AnimationDuration;
    animationEasing?: AnimationTiming;
    content?: ContentType<TValue, TName>;
    coordinate?: Partial<Coordinate>;
    cursor?: boolean | ReactElement | SVGProps<SVGElement>;
    filterNull?: boolean;
    defaultIndex?: number;
    isAnimationActive?: boolean;
    offset?: number;
    payloadUniqBy?: UniqueOption<Payload<TValue, TName>>;
    position?: Partial<Coordinate>;
    reverseDirection?: AllowInDimension;
    shared?: boolean;
    trigger?: 'hover' | 'click';
    useTranslate3d?: boolean;
    viewBox?: CartesianViewBox;
    wrapperStyle?: CSSProperties;
};

type TrapezoidProps

type Props = SVGProps<SVGPathElement> & TrapezoidProps;

type XAxisProps

type Props = Omit<
    PresentationAttributesAdaptChildEvent<any, SVGElement>,
    'scale' | 'ref'
> &
    XAxisProps;

type YAxisProps

type Props = Omit<
    PresentationAttributesAdaptChildEvent<any, SVGElement>,
    'scale' | 'ref'
> &
    YAxisProps;

Namespaces

namespace CartesianGrid

namespace CartesianGrid {}

variable displayName

var displayName: string;

namespace Customized

namespace Customized {}

variable displayName

var displayName: string;

namespace Label

namespace Label {}

variable displayName

var displayName: string;

function parseViewBox

parseViewBox: (props: any) => ViewBox;

function renderCallByParent

renderCallByParent: (
    parentProps: { children?: React.ReactNode; label?: unknown },
    viewBox?: ViewBox,
    checkPropsLabel?: boolean
) => React.ReactElement<any, string | React.JSXElementConstructor<any>>[];

namespace LabelList

namespace LabelList {}

variable displayName

var displayName: string;

function renderCallByParent

renderCallByParent: <T extends Data>(
    parentProps: { children?: React.ReactNode; label?: unknown },
    data: T[],
    checkPropsLabel?: boolean
) => React.JSX.Element[];

Package Files (56)

Dependencies (8)

Dev Dependencies (77)

Peer Dependencies (2)

Badge

To add a badge like this oneto your package's README, use the codes available below.

You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/recharts.

Markdown

[![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/recharts)

HTML

<a href="https://www.jsdocs.io/package/recharts"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>

Updated 1 month ago.
Package analyzed in 9436 ms.
Missing or incorrect documentation? Open an issue for this package.

recharts

Install

Overview

Index

Variables

Functions

Classes

Interfaces

Type Aliases

Namespaces

Variables

variable AreaChart

variable BarChart

variable Cell

variable ComposedChart

variable Cross

variable Curve

variable Dot

variable FunnelChart

variable Global

variable Layer

variable LineChart

variable PieChart

variable PolarGrid

variable Polygon

variable RadarChart

variable RadialBarChart

variable Rectangle

variable ResponsiveContainer

variable ScatterChart

variable Sector

variable Symbols

variable Trapezoid

Functions

function CartesianGrid

function Customized

Returns

function DefaultTooltipContent

function Label

function LabelList

function SunburstChart

function Surface

function Text

Classes

class Area

property defaultProps

property displayName

property getBaseValue

property getComposedData

property handleAnimationEnd

property handleAnimationStart

property id

property renderDotItem

property state

method getDerivedStateFromProps

method render

method renderArea

method renderAreaStatically

method renderAreaWithAnimation

method renderClipRect

method renderDots

method renderHorizontalRect

method renderVerticalRect

class Bar

property defaultProps

property displayName

property getComposedData

Parameter props

Parameter item

Parameter barPosition

Parameter xAxis

Parameter yAxis

Parameter stackedData

property handleAnimationEnd

property handleAnimationStart

property id

property state

method getDerivedStateFromProps

method render

method renderBackground