编辑反应谷歌甘特图

问题描述

我正在使用 React Google Charts 创建甘特图，我需要该图表是可编辑的。需要通过可视化表示来更改数据：例如，沿时间轴移动任务。我可以吗？这是创建甘特图的代码：

function daysToMilliseconds(days: number) {
  return days * 24 * 60 * 60 * 1000;
}

const columns = [
  { type: 'string',label: 'Task ID' },{ type: 'string',label: 'Task Name' },{ type: 'date',label: 'Start Date' },label: 'End Date' },{ type: 'number',label: 'Duration' },label: 'Percent Complete' },label: 'Dependencies' },];

const rows = [
  ['Research','Find sources',new Date(2015,1),5),null,100,null],['Write','Write paper',9),daysToMilliseconds(3),25,'Research,Outline'],['Cite','Create bibliography',7),daysToMilliseconds(1),20,'Research'],['Complete','Hand in paper',10),'Cite,Write'],['Outline','Outline paper',6),];

class Gantt extends VayuModule<any,GanttState> {
  public render(): JSX.Element {
    return (
      <div className="Gantt-container">
        <Chart
          width={'100%'}
          height={'50%'}
          chartType="Gantt"
          loader={<div>Loading Chart</div>}
          data={[columns,...rows]}
          rootProps={{ 'data-testid': '1' }}
          legendToggle
        />
      </div>
    );
  }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

gantt-chart reactjs reactjs