Диаграмма потребления React d3 с использованием компонентов response-d3 - PullRequest
0 голосов
/ 22 июня 2019

Я создаю приложение погоды, в котором я использую OpenWeatherMap для получения данных прогноза. Я хочу нанести данные, аналогичные виджету погоды Google, на диаграмму области.

Я не смог найти много документации для D #, я нашел пакет response-d3-componentetns npm. Документ показывает, что использовать ReactDOM.render

ниже способ потребления не работает

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')
)
}

Ниже приведена ссылка для кодов и ящиков

https://codesandbox.io/s/weather-report-rgu7y-regtl

Не могли бы вы предложить правильный способ употребления его или сослаться на какие-либо примеры?

...