g1eb/reactjs-calendar-heatmap

p.scaleLinear is not a function again

raaaaay-c opened this issue · 1 comments

I was trying to find an answer from the closed issue but there was no answer...so I post my react+jsx code here to see why it happens.

import CalendarHeatmap from 'reactjs-calendar-heatmap';
import React from 'react';

function HeatMap() {
    let data = [{
        "date": "2016-01-01",
        "total": 17164,
        "details": [{
            "name": "Project 1",
            "date": "2016-01-01 12:30:45",
            "value": 9192
        }, {
            "name": "Project 2",
            "date": "2016-01-01 13:37:00",
            "value": 6753
        },

            {
                "name": "Project N",
                "date": "2016-01-01 17:52:41",
                "value": 1219
            }]
    }];

    let print = (value) => {
        console.log(value);
    };

    let overview = {
        year:'year',
        month:'month',
        day:'day'
    };


    return (
        <CalendarHeatmap
            data={data}
            color={'#45ff00'}
            overview={overview.year}
            handler={print.bind(this)}>
        </CalendarHeatmap>
    )

};

export default HeatMap;

I have installed d3 and moment via npm.

resolved :

need to specified d3 version to ^4.11.0