> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/recharts/recharts/llms.txt
> Use this file to discover all available pages before exploring further.

# PolarGrid

> Renders grid lines in a polar chart

Renders grid lines in a polar chart. The PolarGrid component displays concentric circles or polygons and radial lines to help visualize the scale.

## Usage

```tsx theme={null}
import { RadarChart, PolarGrid, PolarAngleAxis, PolarRadiusAxis, Radar } from 'recharts';

<RadarChart width={500} height={500} data={data}>
  <PolarGrid gridType="polygon" />
  <PolarAngleAxis dataKey="subject" />
  <PolarRadiusAxis />
  <Radar dataKey="A" />
</RadarChart>
```

## Props

### Grid type

<ParamField path="gridType" type="'polygon' | 'circle'" default="polygon">
  The type of polar grids.

  * `polygon`: renders concentric polygons
  * `circle`: renders concentric circles
</ParamField>

### Axes

<ParamField path="angleAxisId" type="string | number" default="0">
  The id of the angle axis that this grid uses.
</ParamField>

<ParamField path="radiusAxisId" type="string | number" default="0">
  The id of the radius axis that this grid uses.
</ParamField>

### Custom grid values

<ParamField path="polarAngles" type="number[]">
  The array of angles for each radial line grid, in degrees.

  When used inside a chart context, this is calculated automatically and this prop is ignored.
</ParamField>

<ParamField path="polarRadius" type="number[]">
  The array of radii for each concentric circle/polygon grid.

  When used inside a chart context, this is calculated automatically and this prop is ignored.
</ParamField>

### Position (standalone mode)

These props are only used when PolarGrid is rendered outside a chart context.

<ParamField path="cx" type="number">
  The x-coordinate of the center.

  Calculated automatically inside a chart context.
</ParamField>

<ParamField path="cy" type="number">
  The y-coordinate of the center.

  Calculated automatically inside a chart context.
</ParamField>

<ParamField path="innerRadius" type="number">
  The radius of the inner polar grid.

  Calculated automatically inside a chart context.
</ParamField>

<ParamField path="outerRadius" type="number">
  The radius of the outer polar grid.

  Calculated automatically inside a chart context.
</ParamField>

### Appearance

<ParamField path="radialLines" type="boolean" default="true">
  If true, radial lines are drawn from the center to the edge.
</ParamField>

<ParamField path="stroke" type="string" default="#ccc">
  The stroke color of the grid lines.
</ParamField>

<ParamField path="fill" type="string">
  The fill color of the background.

  If specified, a filled background is rendered behind the grid.
</ParamField>

<ParamField path="strokeWidth" type="number">
  The stroke width of the grid lines.
</ParamField>

<ParamField path="strokeDasharray" type="string">
  The pattern of dashes and gaps for the grid lines.

  Example: "3 3" creates a dashed line.
</ParamField>

### Display

<ParamField path="zIndex" type="number" default="-100">
  The z-index of the grid.

  Negative values render behind most other elements.
</ParamField>

### Other

<ParamField path="className" type="string">
  CSS class name for the polar grid element.
</ParamField>
