es6/jsx

[PatrickDuncan]

Hey I'm using v1.1.1 and having trouble using the properties in the documentation with es6 and jsx.

var BarChart = require('react-chartjs').Bar; If I do horizontalBar or set the type in the component's prop I get an error and nothing happens respectively.

Also backgroundColor does nothing, I had to use fillColor which isn't in the docs for bar charts.

import React, { Component } from 'react';

var BarChart = require('react-chartjs').Bar;

export default class Languages extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: {
        labels: [...],
        datasets: [{
          label: 'Language Profiency',
          fillColor: 'rgba(244,67,54,0.5)',
          borderColor: '#000',
          data: [4.5, 4, 4, 4, 3, 3, 2, 1.5],
        }]
      },
      options: {
        scales: {
          xAxes: [{
            stacked: true
          }],
          yAxes: [{
            stacked: true
          }]
        }
      }
    }
  }

  shouldComponentUpdate(nextProps, nextState) {
    return true;
  }

  render() {
    return (
      <BarChart
        width='500'
        height='350'
        type='horizontalBar'
        data={this.state.data}
        options={this.state.options} 
      />
    );
  }
}

[ledsun]

I think you use chart.js v1.1.1. That has not a backgroundColor option and has a fillColor option. Please refer documents of chart.js v1.1.1.

And, react-chartjs is not support the horizontalBar now. Please refer #115