thochi / victory

A collection of composable React components for building interactive data visualizations

Victory

Victory is an opinionated, but fully overridable, ecosystem of composable React components for building interactive data visualizations. This repo aggregates all of the stable Victory components so they can be conveniently included.

See the docs and examples on the website: http://victory.formidable.com

Important: This project is in alpha release. We're hard at work fixing bugs and improving the API. Be prepared for breaking changes!

Get started

1. Add Victory to your project:

npm install victory --save

2. 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'));

3. VictoryPie component will be rendered, and you should see:
   

Including components:

Components can be included individually

import {VictoryLine, VictoryAxis} from "victory"

<VictoryLine/>

Or imported as a set:

import * as V from "victory"

<V.VictoryLine/>

Components

You can read about these Victory components via interactive docs!

• VictoryAxis
• VictoryBar
• VictoryChart
• VictoryLine
• VictoryPie
• VictoryScatter
• VictoryLabel
• VictoryAnimation

Animation

Wrap any Victory component with VictoryAnimation and it will transition smoothly between states whenever data changes. VictoryAnimation relies on d3's interpolator, so it knows how to transitions between colors, dates, numbers, strings etc.

Development

Please see DEVELOPMENT

Contributing

Please see CONTRIBUTING

Roadmap

Please see ROADMAP