@@ -11,7 +11,6 @@ import React, {
11
11
import classNames from 'classnames'
12
12
13
13
import Chart , { ChartData , ChartOptions , ChartType , InteractionItem , Plugin } from 'chart.js/auto'
14
- import * as chartjs from 'chart.js'
15
14
import { customTooltips as cuiCustomTooltips } from '@coreui/chartjs'
16
15
17
16
import assign from 'lodash/assign'
@@ -136,25 +135,37 @@ export const CChart = forwardRef<Chart | undefined, CChartProps>((props, ref) =>
136
135
} else return merge ( { } , data )
137
136
} , [ data , canvasRef . current ] )
138
137
138
+ const computedOptions = useMemo ( ( ) => {
139
+ return customTooltips
140
+ ? merge ( { } , options , {
141
+ plugins : {
142
+ tooltip : {
143
+ enabled : false ,
144
+ mode : 'index' ,
145
+ position : 'nearest' ,
146
+ external : cuiCustomTooltips ,
147
+ } ,
148
+ } ,
149
+ } )
150
+ : options
151
+ } , [ data , canvasRef . current , options ] )
152
+
139
153
const [ chart , setChart ] = useState < Chart > ( )
140
154
155
+ useEffect ( ( ) => {
156
+ console . log ( chart )
157
+ } , [ chart ] )
158
+
141
159
useImperativeHandle < Chart | undefined , Chart | undefined > ( ref , ( ) => chart , [ chart ] )
142
160
143
161
const renderChart = ( ) => {
144
162
if ( ! canvasRef . current ) return
145
163
146
- if ( customTooltips ) {
147
- chartjs . defaults . plugins . tooltip . enabled = false
148
- chartjs . defaults . plugins . tooltip . mode = 'index'
149
- chartjs . defaults . plugins . tooltip . position = 'nearest'
150
- chartjs . defaults . plugins . tooltip . external = cuiCustomTooltips
151
- }
152
-
153
164
setChart (
154
165
new Chart ( canvasRef . current , {
155
166
type,
156
167
data : computedData ,
157
- options,
168
+ options : computedOptions ,
158
169
plugins,
159
170
} ) ,
160
171
)
@@ -182,7 +193,7 @@ export const CChart = forwardRef<Chart | undefined, CChartProps>((props, ref) =>
64CA
182
193
if ( ! chart ) return
183
194
184
195
if ( options ) {
185
- chart . options = { ...options }
196
+ chart . options = { ...computedOptions }
186
197
}
187
198
188
199
if ( ! chart . config . data ) {
0 commit comments