Consuming React d3 area chart using react-d3-components - reactjs

Question

I am creating a weather application where I am consuming OpenWeatherMap to get forecast data. I want to plot the data similar to google weather widget in an area chart.
I could not find much documentation for D#, I found react-d3-componetns npm package.
Documentaton shows to use ReactDOM.render
Below way of consuming is not working
import React from "react";
import ReactDom from 'react-dom';
import "./styles.css";
import ReactD3 from "react-d3-components";
export class WeatherGraph extends React.Component {
constructor(props) {
super(props);
this.state = {
data: [
{
label: "somethingA",
values: [
{ x: 0, y: 2 },
{ x: 1.3, y: 5 },
{ x: 3, y: 6 },
{ x: 3.5, y: 6.5 },
{ x: 4, y: 6 },
{ x: 4.5, y: 6 },
{ x: 5, y: 7 },
{ x: 5.5, y: 8 }
]
}
]
};
}
ReactDom.render(
<ReactD3.AreaChart
data={this.state.data}
width={400}
height={400}
yOrientation='right' // if you do not provide right default left orientation for yAxis will be used
margin={{top: 10, bottom: 50, left: 50, right: 10}}/>,
document.getElementById('location')
)
}
Below is the codesandbox link
https://codesandbox.io/s/weather-report-rgu7y-regtl
Could you suggest the right way of consuming it or refer to any examples ?