File tree Expand file tree Collapse file tree 1 file changed +26
-1
lines changed Expand file tree Collapse file tree 1 file changed +26
-1
lines changed Original file line number Diff line number Diff line change @@ -48,7 +48,7 @@ import {Doughnut} from 'react-chartjs-2';
4848
4949### Properties
5050
51- * data: PropTypes.object.isRequired,
51+ * data: ( PropTypes.object | PropTypes.func) .isRequired,
5252* width: PropTypes.number,
5353* height: PropTypes.number,
5454* legend: PropTypes.object,
@@ -87,6 +87,31 @@ render() {
8787}
8888```
8989
90+ ### Getting context for data generation
91+ Canvas node and hence context, that can be used to create CanvasGradient background,
92+ is passed as argument to data if given as function:
93+
94+ This approach is useful when you want to keep your components pure.
95+
96+ ``` js
97+ render () {
98+ const data = (canvas ) => {
99+ const ctx = canvas .getContext (" 2d" )
100+ const gradient = ctx .createLinearGradient (0 ,0 ,100 ,0 );
101+ ...
102+ return {
103+ ...
104+ backgroundColor: gradient
105+ ...
106+ }
107+ }
108+
109+ return (
110+ < Line data= {data} / >
111+ )
112+ }
113+ ```
114+
90115### Chart.js Defaults
91116Chart.js defaults can be set by importing the ` defaults ` object:
92117
You can’t perform that action at this time.
0 commit comments