@vx/grid

The @vx/grid package lets you create gridlines for charts. <GridRows /> render horizontally, <GridColumns /> render vertically, or you can use a <Grid /> to get them both at once!

Usage

import { Grid } from '@vx/grid';
// or
// import * as Grid from '@vx/grid';
// <Grid.Grid />

const grid = (
  <Grid
    xScale={xScale}
    yScale={yScale}
    width={xMax}
    height={yMax}
    numTicksRows={numTicksForHeight(height)}
    numTicksColumns={numTicksForWidth(width)}
  />
);

Installation

npm install --save @vx/grid