Как динамически изменять параметры в React-ChartJS-2? - PullRequest
Новая
       15

Как динамически изменять параметры в React-ChartJS-2?

0 голосов
/ 28 августа 2018

Моя проблема в том, что я хочу изменить параметры (мой тип для отображения XAxis, чтобы быть более конкретным) в моем компоненте Bar динамически (в зависимости от параметра). Я провел весь день, пытаясь решить эту проблему, но я застрял. Пожалуйста, посмотрите: 

import React, { Component } from 'react';
import { Bar } from 'react-chartjs-2';
import './App.css'

const data = {
  labels: [1527372000000, 1527458400000, 1527544800000, 1527631200000, 1527717600000, 1527804000000, 1527890400000],
  datasets: [
    {
      label: 'My First dataset',
      backgroundColor: 'rgba(255,99,132,0.2)',
      borderColor: 'rgba(255,99,132,1)',
      borderWidth: 1,
      hoverBackgroundColor: 'rgba(255,99,132,0.4)',
      hoverBorderColor: 'rgba(255,99,132,1)',
      data: [65, 59, 80, 81, 56, 55, 40]
    }
  ]
};

class App extends Component {
  render() {
    let xtype;

    if(true) { 
      xtype = 'time'
    }

    return (
      <div className='bar'>
        <Bar
          data={data}
          options={{
            maintainAspectRatio: false,
            responsive: true,
            scales: {
              xAxes: [{
                type: {xtype}, // i want this value to change to 'time' if condition is true
                distribution: 'series'
              }],
              yAxes: [{
                ticks: {
                  beginAtZero: true
                }
              }]
            }
          }}
        />
      </div>
    );
  }
}

export default App;

Спасибо за вашу помощь!

...