victory
A collection of composable React components for building interactive data visualizations
A React component library for adding charts and data visualizations, pie charts, bar charts, line graphs, scatter plots, and more, to web or React Native mobile apps by importing a component and passing your data as props.
Victory is a collection of React components for building charts and interactive data visualizations for the web. It lets you add charts to a React application the same way you add any other UI component, without writing low-level graphics code yourself.
The library includes components for pie charts, bar charts, line charts, scatter plots, area charts, and several other visualization types. Each component accepts data and configuration as standard React props, so you describe what you want to display and Victory handles the rendering. Components are designed to be composable, meaning you can combine and layer multiple chart types within a single view to build more complex displays.
Installing the library requires adding a single package to a React project. A minimal example in the README shows that rendering a pie chart is as short as importing a VictoryPie component and dropping it into JSX with no additional setup. The library requires React version 16.3 or above.
A separate package called Victory Native shares most of the same code and offers a nearly identical API for React Native projects, which target mobile devices rather than the web. Skills and patterns learned on the web version carry over directly to the mobile version.
The project is maintained by Formidable, now part of NearForm, and is described as actively maintained. Full documentation, guides, and interactive examples are available on the project website, and there is also a code sandbox where you can experiment with all components without installing anything locally.
Where it fits
- Add a bar chart, line chart, or pie chart to a React web app by importing one component and passing your data array as a prop.
- Layer multiple chart types together in a single view to build complex data dashboards without writing graphics code.
- Use Victory Native to add the same charts to a React Native mobile app with a nearly identical API and no new skills to learn.
- Build interactive data visualizations in a browser sandbox without installing anything locally using the project's code sandbox.