Consuming React d3 area chart using react-d3-components

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 ?