Open
Description
I pass new itemsObj changed, but charts still not rerendering, only soltuion is to key={JSON.stringify(itemsObj)}
but this wont be ideal because right now big lag but if chart gets bigger even more.
How to trigger Charts to rerender when prop has changed?
import { Label } from '@/components/Inputs/components/Label'
import { Box } from '@mui/material'
import Chart from 'react-apexcharts'
import type { GraphData } from '../Graph'
import type { ChartTypesT } from '../graph.data'
export const GraphPreview = ({
itemsObj,
type,
isViewMode = false,
}: {
itemsObj?: GraphData['content']['itemsObj']
type?: ChartTypesT
isViewMode?: boolean
}) => {
if (!itemsObj) return null
return (
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
{!isViewMode && <Label id="graph-preview" label="Graph Preview" />}
<Chart
key={JSON.stringify(itemsObj)}
options={{
...itemsObj.options,
chart: {
id: 'graph-preview',
animations: { enabled: false },
toolbar: { show: false },
},
}}
series={itemsObj.series}
type={type}
width="500"
/>
</Box>
)
}
Metadata
Metadata
Assignees
Labels
No labels