victory-tooltip-basic.js

import React from "react";
import styled from "styled-components";
import { VictoryChart, VictoryBar, VictoryTooltip } from "victory";

const Container = styled("div")`
font-family: sans-serif;
text-align: center;
`;


const data = [
  {name: 'John', score: 20, label: 'label one'},
  {name: 'Joe', score: 10, label: 'label two'},
  {name: 'Jos', score: 30, label: 'label three'},
  {name: 'Joy', score: 15, label: 'label four'},
  {name: 'Joan', score: 40, label: 'label five'},
  {name: 'Johnny', score: 50, label: 'label six'},
];

export default function App() {
  return (
    <Container>
      <h1>VictoryTooltip</h1>
      <VictoryChart>
        <VictoryBar 
        data={data}
        x="score"
        y="name"
        />
      </VictoryChart>
    </Container>
  );
}