react-chartjs-2
react-chartjs-2 copied to clipboard
Custom chart controllers support
It does not seem possible to register and use a new chart controller type:
Chart.controllers.MyType = Chart.DatasetController.extend({
});
since the chart react components have predefined types (doughnut, pie, line, etc.). It would be nice to be able to render a ChartComponent directly and specify the custom type:
<ChartComponent type='MyType' ... />
I'm just starting to spec the solution but here are my untested thoughts you might be able to expand on. From the docs, it should be able to work. I won't know for a few days till I'm able to get back to trying it out but according to the readme regarding accessing the Chart.js instance, you can do the following
import ChartComponent, { Chart } from 'react-chartjs-2';
export class MyBarChart extends React.Component {
componentWillMount() {
Chart.defaults.myBarChart = Chart.defaults.bar;
Chart.controllers.myBarChart = Chart.controllers.bar.extend({...});
}
render() {
return (
<ChartComponent
{...this.props}
ref={ref => this.chart_instance = ref && ref.chart_instance}
// You can do this because of https://github.com/jerairrest/react-chartjs-2/blob/master/src/index.js#L25 where it is checking the Chart.js instance for a controller that matches the type.
type='myBarChart'
/>
);
}
Super cool @smcguinness !