8000 refactor: add custom tooltips configuration to local config instead o… · isaacky/coreui-react@91f17d3 · GitHub
[go: up one dir, main page]

Skip to content

Commit 91f17d3

Browse files
committed
refactor: add custom tooltips configuration to local config instead of global
1 parent d1a94cf commit 91f17d3

File tree

1 file changed

+21
-10
lines changed

1 file changed

+21
-10
lines changed

packages/coreui-react-chartjs/src/CChart.tsx

Lines changed: 21 additions & 10 deletions
64CA
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import React, {
1111
import classNames from 'classnames'
1212

1313
import Chart, { ChartData, ChartOptions, ChartType, InteractionItem, Plugin } from 'chart.js/auto'
14-
import * as chartjs from 'chart.js'
1514
import { customTooltips as cuiCustomTooltips } from '@coreui/chartjs'
1615

1716
import assign from 'lodash/assign'
@@ -136,25 +135,37 @@ export const CChart = forwardRef<Chart | undefined, CChartProps>((props, ref) =>
136135
} else return merge({}, data)
137136
}, [data, canvasRef.current])
138137

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+
139153
const [chart, setChart] = useState<Chart>()
140154

155+
useEffect(() => {
156+
console.log(chart)
157+
}, [chart])
158+
141159
useImperativeHandle<Chart | undefined, Chart | undefined>(ref, () => chart, [chart])
142160

143161
const renderChart = () => {
144162
if (!canvasRef.current) return
145163

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-
153164
setChart(
154165
new Chart(canvasRef.current, {
155166
type,
156167
data: computedData,
157-
options,
168+
options: computedOptions,
158169
plugins,
159170
}),
160171
)
@@ -182,7 +193,7 @@ export const CChart = forwardRef<Chart | undefined, CChartProps>((props, ref) =>
182193
if (!chart) return
183194

184195
if (options) {
185-
chart.options = { ...options }
196+
chart.options = { ...computedOptions }
186197
}
187198

188199
if (!chart.config.data) {

0 commit comments

Comments
 (0)
0