A collection of composable React components for building interactive data visualizations
JavaScript HTML
Fetching latest commit…
Cannot retrieve the latest commit at this time.

README.md

Travis Status Join the chat at https://gitter.im/FormidableLabs/victory

Victory

an ecosystem of composable React components for building interactive data visualizations.

Getting started

  1. Add Victory to your project:
$ npm install victory --save
  1. Add your first Victory component:
import React, { Component } from 'react';
import { render } from 'react-dom';
import { VictoryPie } from 'victory';

class PieChart extends Component {
  render() {
    return (
      <VictoryPie />
    );
  }
}

render(<PieChart />, document.getElementById('app'));
  1. VictoryPie component will be rendered, and you should see:

pie

Requirements

Projects using Victory should also depend on React

Victory Native

Want to use Victory with React Native? Check out victory-native Victory Native shares most of its code with Victory, and has a nearly identical api!

Contributing

Issues

Jest Snapshots

If you want to use Jest snapshot testing with Victory, you may encounter a problem where the Jest snapshot changes every time, due to a randomly generated clipId being used for a VictoryClipContainer group component. The solution to this is to set a static clipId on your VictoryClipContainer.

For example, when creating a VictoryLine component, you can pass a groupComponent prop:

<VictoryLine
  groupComponent={<VictoryClipContainer clipId={1} />}
/>

Now the clipId attached to your VictoryLine component will always be the same, and your snapshot will not change with each test run.