$ npm install --save d3-stacked-react
Below is the example of custom components:
<D3StackedRect data={data} height={700} color="#96cc66" />
const data = {
titles: {
P3: 10,
P4: 12,
P5: 13,
P6: 8,
P7: 3,
P8: 3,
P9: 2,
},
subTitles: {
P3: 'Junior Engineer',
P4: 'Engineer',
P5: 'Senior Engineer',
P6: '',
P7: 'Senior Principle Engineer',
P8: 'Lead Principle Engineer',
P9: 'Distinguised Engineer',
},
};
Note: if associated title field in subTitles is empty, it won't render the subTitles. Otherwise, it will add '-' to the subTitles.
Set the height of of the SVG.
Set the color of of the SVG, should be a hash string like '#96cc66', if not given, will use random color
This project use Parcel. If you hasn't install it, you might need install Parcel first.
npm install -g parcel-bundler
or
yarn global add parcel-bundler
$ git clone git@github.com:cthroo/d3-stacked-rect.git
$ cd d3-stacked-rect
$ npm install
$ npm run start
Then
open http://localhost:1234
## License
MIT