Question

我想在这样的反应器（https://www.npmjs.com/package/reactjs-calendar-heatmap#example-data）中创建一个日历热图，其中包含一些随机数据，这就是我的代码。

import React, { Component } from 'react';
import CalendarHeatmap from 'reactjs-calendar-heatmap';
import moment from 'moment';
import * as d3 from 'd3';

class App extends Component {
 constructor(props) {
  super(props)
//  Initialize random data
let now = moment().endOf('day').toDate();
let time_ago = moment().startOf('day').subtract(2, 'year').toDate();
let data = d3.timeDays(time_ago, now).map(function (dateElement, index) {
  return {
    date: dateElement,
    details: Array.apply(null, new Array(Math.floor(Math.random() * 15))).map(function (e, i, arr) {
      return {
        'name': 'Project ' + Math.ceil(Math.random() * 10),
        'date': function () {
          let projectDate = new Date(dateElement.getTime());
          projectDate.setHours(Math.floor(Math.random() * 24));
          projectDate.setMinutes(Math.floor(Math.random() * 60));
          return projectDate;
        }(),
        'value': 3600 * ((arr.length - i) / 5) + Math.floor(Math.random() * 3600) * Math.round(Math.random() * (index / 365))
      }
    }),
    init: function () {
      this.total = this.details.reduce(function (prev, e) {
        return prev + e.value;
      }, 0)
      return this;
     }
   }.init()
 })
this.state = {
  data: data,
  color: '#cd2327',
  overview: 'year',  //here is overview, we can change it to "global/year/month/week/day"
   }
 }
   print(val) {
    console.log(val);
    }
 render() {
   return (
    <CalendarHeatmap
    data={this.state.data}
    color={this.state.color}
    overview={this.state.overview}
    handler={this.print.bind(this)}>
   </CalendarHeatmap>
   )
  }
 }
  export default App;

我在其中收到错误，如此图片所示。error image

错误：类型错误：this.items.selectAll（...）数据（...）进入（...）追加（...）ATTR（...）风格（...）风格（。。。。。 ...）。ATTR（...）。ATTR（...）。ATTR（...）。ATTR（...）。ATTR（...）。ATTR（...）。ATTR（。 ..）。on（...）。on（...）。on（...）。transition不是函数

我不知道如何让它发挥作用。请帮帮我。提前谢谢。

reactjs-calendar-heatmap错误： - TypeError：this.items.selectAll（

0 个答案: