Radar

Props

• activeDotFunction | Partial<ActiveDotProps> | ReactNode | false | trueoptional

  DEFAULT: true

• angleAxisIdnumber | stringoptional

  DEFAULT: 0

• animationBeginnumberoptional

  Specifies when the animation should begin, the unit of this option is ms.

  DEFAULT: 0

• animationDurationnumberoptional

  Specifies the duration of animation, the unit of this option is ms.

  DEFAULT: 1500

• animationEasing"ease" | "ease-in" | "ease-in-out" | "ease-out" | "linear"optional

  The type of easing function.

  DEFAULT: "ease"

• baseLinePointsArray<RadarPoint>optional

• classNamestringoptional

• connectNullsbooleanoptional

• dataKeyTypedDataKey<DataPointType, DataValueType>optional

  The data that you provide via the data prop is an array of objects. Each object can have multiple properties, each representing a different data dimension. Use the dataKey prop to specify which property (or dimension) to use for this component.

  Typically, you will want to have one dataKey on the X axis, and different dataKey on the Y axis, where they extract different values from the same data objects.

  Decides how to extract the value 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.

  Examples:

  • Simple Radar Chart
  • Specified Domain Radar Chart
  • Radar Chart Example

• dotFunction | Partial<Props> | ReactNode | false | trueoptional

  Renders a circle element at each data point. Options:

  • false: no dots are drawn;
  • true: renders the dots with default settings;
  • object: the props of the dot. This will be merged with the internal calculated props of each dot;
  • ReactElement: the custom dot element;
  • function: a render function of the custom dot.

  DEFAULT: false

• hidebooleanoptional

  DEFAULT: false

• isAnimationActive"auto" | false | trueoptional

  If set false, animation of polygon will be disabled. If set "auto", the animation will be disabled in SSR and enabled in browser.

  DEFAULT: "auto"

  Examples:

  • Radar Chart Example

• isRangebooleanoptional

• labelFunction | Props | ReactNode | false | trueoptional

  Renders one label for each point. Options:

  • true: renders default labels;
  • false: no labels are rendered;
  • object: the props of LabelList component;
  • ReactElement: a custom label element;
  • function: a render function of custom label.

  DEFAULT: false

• legendType"circle" | "cross" | "diamond" | "line" | "none" | "plainline" | "rect" | "square" | "star" | "triangle" | "wye"optional

  The type of icon in legend. If set to 'none', no legend item will be rendered.

  DEFAULT: "rect"

• radiusAxisIdnumber | stringoptional

  DEFAULT: 0

• shapeFunction | ReactNodeoptional

  If set a ReactElement, the shape of radar can be customized. If set a function, the function will be called to render customized shape.

• tooltipType"none"optional

• zIndexnumberoptional

  DEFAULT: 100

• onAnimationEndReact.AnimationEventHandler<T>optional

  The customized event handler of animation end

• onAnimationStartReact.AnimationEventHandler<T>optional

  The customized event handler of animation start

• onMouseEnterFunctionoptional

• onMouseLeaveFunctionoptional