react-gantt

Gantt chart react component

Please ★ this repo if you found it useful ★ ★ ★

Submit your ReactGantt use cases and I will feature them in the in the used by section

Built by Silicon Hills LLC

Silicon Hills offers premium Node and React develpoment and support services. Get in touch at nuevesolutions.com.

Features

• Multiple steps
• Custom styles
• Dynamic bounds

Demo

See a demo

Installation

npm install --save react-gantt

Dependencies

• NodeJS
• React
• React DOM

Usage

import ReactGantt, { GanttRow } from 'react-gantt';

class Demo extends Component {
  render() {
    return (
      <ReactGantt
        templates={{
          myTasks: {
            title: 'My Tasks',
            steps: [
              {
                name: 'Task Phase One',
                color: '#0099FF'
              },
              {
                name: 'Task Phase Two',
                color: '#FF9900'
              }
            ]
          }
        }}
        leftBound={moment().set({hour: 0, date: 30, month: 5, year: 2016}).toDate()}
        rightBound={moment().set({hour: 0, date: 29, month: 8, year: 2016}).toDate()}
      >
        <GanttRow
          title="Task 1"
          templateName="myTasks"
          steps={[
            moment().set({hour: 0, date: 1, month: 6, year: 2016}).toDate(),
            moment().set({hour: 0, date: 4, month: 8, year: 2016}).toDate(),
            moment().set({hour: 0, date: 17, month: 8, year: 2016}).toDate()
          ]}
        />
        <GanttRow
          title="Task 1"
          templateName="myTasks"
          steps={[
            moment().set({hour: 0, date: 27, month: 2, year: 2016}).toDate(),
            moment().set({hour: 0, date: 9, month: 7, year: 2016}).toDate(),
            moment().set({hour: 0, date: 22, month: 7, year: 2016}).toDate()
          ]}
        />
      </ReactGantt>
    );
  }
}

Props

ReactGantt

GanttTimeline

GanttRow

GanttBar

GanttPopup

Support

Submit an issue

Screenshots

Contributing

Review the guidelines for contributing

License

MIT License

Jam Risser © 2018

Changelog

Review the changelog

Credits

• Jam Risser - Author

Used By

• ModernGreek - The next generation of fraternity and sorority apparel
• yerbaBuena - a superpowered approach to electronic medical records
• TaskCluster - task execution framework that supports Mozilla's continuous integration and release processes

Support on Liberapay

A ridiculous amount of coffee ☕ ☕ ☕ was consumed in the process of building this project.

Add some fuel if you'd like to keep me going!