初心者：Googleチャートを使用して反応ガントチャートを設定する

Question

ゴール：リアクションにガントチャートを表示します。現在githubの反応ラッパーでGoogle Chartsを使用しています。私はまだReactとJSの新人です、私は学びたいと思っています！

問題：私がまだ気づいていない重大な誤解がある可能性があります。私はドキュメンテーション/例を見つけることができません。私は文法が間違っていると90％確信していますが、数時間後でも私は正しい道にいるとは思っていません。

React google charts Gant exampleを現在レンダリングに引っかかっていますガイドライン

^ The github readme from the above, specifically using the rows/columns setup

This older SO question.

コードとして小道具ウィンドウを使用しようとすると：：

私はを使用してい

リソース

import { Chart } from 'react-google-charts'; import React from 'react'; class ExampleChart extends React.Component { constructor(props) { super(props); this.state = { rows: [ ['Research','Find sources','2015-01-01T08:00:00.000Z','2015-01-05T08:00:00.000Z',null,100,null], ['Write','Write paper',null,'2015-01-09T08:00:00.000Z',259200000,25,'Research,Outline'], ['Cite','Create bibliography',null,'2015-01-07T08:00:00.000Z',86400000,20,'Research'], ['Complete','Hand in paper',null,'2015-01-10T08:00:00.000Z',86400000,0,'Cite,Write'], ['Outline','Outline paper',null,'2015-01-06T08:00:00.000Z',86400000,100,'Research'], ], columns: [ { id:'Task ID', type:'string', }, { id:'Task Name', type:'string', }, { id:'Start Date', type:'date', }, { id:'End Date', type:'date', }, { id:'Duration', type:'number', }, { id:'Percent Complete', type:'number', }, { id:'Dependencies', type:'string', }, ], }; } render() { return ( <Chart graph_id="ganttchart" chartType = "Gantt" columns={this.state.columns} rows={this.state.rows} chartPackages={['gantt']} width="100%" height="9999px"> </Chart> ); } } export default ExampleChart; 

Answer 1

反応するgoogle-chartsはDateのオブジェクトを期待しているようです。私は、ソースでは明示的に確認していませんが、rowsを次のように変更すると、すべてがうまくレンダリングされます。

rows: [ 
    ['Research','Find sources',new Date(2015,1,1,8,0,0), new Date(2015,1,5,8,0,0),null,100,null], 
    ['Write','Write paper',null,new Date(2015,1,9,12,0,0),259200000,25,'Research,Outline'], 
    ['Cite','Create bibliography',null,new Date(2015,1,7,8,0,0),86400000,20,'Research'], 
    ['Complete','Hand in paper',null,new Date(2015,1,10,8,0,0),86400000,0,'Cite,Write'], 
    ['Outline','Outline paper',null,new Date(2015,1,6,8,0,0),86400000,100,'Research'], 
],