Events filtering. Closes #3356

This commit is contained in:
Mike Cao 2025-04-25 18:06:41 -07:00
parent b8a582c8da
commit d4b786380b
4 changed files with 59 additions and 21 deletions

View file

@ -34,7 +34,7 @@ export function Chart({
className,
chartOptions,
}: ChartProps) {
const canvas = useRef();
const canvas = useRef(null);
const chart = useRef(null);
const [legendItems, setLegendItems] = useState([]);
@ -86,7 +86,7 @@ export function Chart({
dataset.data = data?.datasets[index]?.data;
if (chart.current.legend.legendItems[index]) {
chart.current.legend.legendItems[index].text = data?.datasets[index]?.label;
chart.current.legend.legendItems[index].text = data.datasets[index]?.label;
}
}
});
@ -95,6 +95,12 @@ export function Chart({
}
}
if (data.focusLabel !== null) {
chart.current.data.datasets.forEach(ds => {
ds.hidden = data.focusLabel ? ds.label !== data.focusLabel : false;
});
}
chart.current.options = options;
// Allow config changes before update
@ -105,16 +111,6 @@ export function Chart({
setLegendItems(chart.current.legend.legendItems);
};
useEffect(() => {
if (data) {
if (!chart.current) {
createChart(data);
} else {
updateChart(data);
}
}
}, [data, options]);
const handleLegendClick = (item: LegendItem) => {
if (type === 'bar') {
const { datasetIndex } = item;
@ -136,6 +132,16 @@ export function Chart({
setLegendItems(chart.current.legend.legendItems);
};
useEffect(() => {
if (data) {
if (!chart.current) {
createChart(data);
} else {
updateChart(data);
}
}
}, [data, options]);
return (
<>
<div className={classNames(styles.chart, className)}>