Voronoi - Grouped Tooltips

Live View

Loading...

Live Editor

<VictoryChart
  containerComponent={<VictoryVoronoiContainer />}
  theme={VictoryTheme.clean}
>
  <VictoryGroup
    color="#c43a31"
    labels={({ datum }) => `y: ${datum.y}`}
    labelComponent={<VictoryTooltip style={{ fontSize: 10 }} />}
    data={[
      { x: 1, y: -3 },
      { x: 2, y: 5 },
      { x: 3, y: 3 },
      { x: 4, y: 0 },
      { x: 5, y: -2 },
      { x: 6, y: -2 },
      { x: 7, y: 5 },
    ]}
  >
    <VictoryLine />
    <VictoryScatter size={({ active }) => (active ? 8 : 3)} />
  </VictoryGroup>
  <VictoryGroup
    labels={({ datum }) => `y: ${datum.y}`}
    labelComponent={<VictoryTooltip style={{ fontSize: 10 }} />}
    data={[
      { x: 1, y: 3 },
      { x: 2, y: 1 },
      { x: 3, y: 2 },
      { x: 4, y: -2 },
      { x: 5, y: -1 },
      { x: 6, y: 2 },
      { x: 7, y: 3 },
    ]}
  >
    <VictoryLine />
    <VictoryScatter size={({ active }) => (active ? 8 : 3)} />
  </VictoryGroup>
</VictoryChart>