Build D3.js stacked bar chart within React.js component

Hello there!

We want a D3.js chart within a React.js component, that updates the chart when the data is updated.

Requirements:

- React.js 17.0.1

- d3.js 6.5.0

- 2x Datasets provided in the '[login to view URL]'

- Template chart function provided as '[login to view URL]'

- The data is initialised in the component state with 'dataset1'

- A "Change" button above the chart calls setState to 'dataset2', thus updating the chart (including rescaling axes)

- Styling of the chart to appear as per attached file "chart [login to view URL]" and "[login to view URL]"

- However, needs to be a stacked bar chart

- The stacked bar chart should have a legend and tooltips (eg: see this example for a legend and tooltips [login to view URL])

Deliverables:

- Visual confirmation that the code works (eg: screenshare, video of screen)

- Textfiles for the React.js component, and associated .js or other files

- [login to view URL] for the working version in the freelancers development environment

- Confirmation that the code works in our development environment

Thanks!

JavaScript CSS HTML React.js D3.js

Projekt ID: #29569942

Om projektet