Chart not rendering initially, only after chart updates

[stevewillard]

Anyone have any idea why my chart doesn't render initially, but if I update the component using the react-hot-loader (webpack), things redraw. This is my component:

I tried throwing on the "redraw" prop but it doesn't seem to help.

import React from "react";
import { Line } from "react-chartjs";

var chartOptions = {
    bezierCurve : false,
    datasetFill : false,
    pointDotStrokeWidth: 4,
    scaleShowVerticalLines: false,
    responsive: true
};

var styles = {
    "graphContainer" : {
        "backgroundColor" : "#fff",
        "height" : "235px",
        "width" : "1150px",
        "marginTop" : "15px",
        "padding" : "20px"
    }
};

export default class Histogram extends React.Component {
    constructor(props) {
        super(props);

        this.state = {
            chartData: {
                labels: ["January", "February", "March", "April", "May", "June", "July"],
                datasets: [
                    {
                        fillColor: "#25BDFF",
                        strokeColor: "#25BDFF",
                        pointColor: "#25BDFF",
                        pointStrokeColor: "#fff",
                        pointHighlightFill: "#fff",
                        pointHighlightStroke: "#25BDFF",
                        data: [28, 48, 40, 19, 86, 27, 90]
                    }
                ]
            }
        };
    }

    render() {
        return (
            <div>
                <div style={styles.graphContainer}>
                    <Line data={this.state.chartData} options={chartOptions} width="1100" height="150" />
                </div>
            </div>
        );
    }
};