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 !
Most helpful comment
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