diff --git a/plugins/plotly-express/src/js/src/PlotlyExpressChart.tsx b/plugins/plotly-express/src/js/src/PlotlyExpressChart.tsx index 7f8f546be..2d7bace4a 100644 --- a/plugins/plotly-express/src/js/src/PlotlyExpressChart.tsx +++ b/plugins/plotly-express/src/js/src/PlotlyExpressChart.tsx @@ -14,6 +14,7 @@ export function PlotlyExpressChart( const { fetch } = props; const containerRef = useRef(null); const [model, setModel] = useState(); + const [widgetRevision, setWidgetRevision] = useState(0); // Used to force a clean chart state on widget change useEffect(() => { let cancelled = false; @@ -21,6 +22,7 @@ export function PlotlyExpressChart( const widgetData = await fetch(); if (!cancelled) { setModel(new PlotlyExpressChartModel(dh, widgetData, fetch)); + setWidgetRevision(r => r + 1); } } @@ -37,6 +39,7 @@ export function PlotlyExpressChart( ) { const { fetch, metadata = {}, ...rest } = props; const containerRef = useRef(null); const [model, setModel] = useState(); + const [widgetRevision, setWidgetRevision] = useState(0); // Used to force a clean chart state on widget change const makeModel = useCallback(async () => { const widgetData = await fetch(); const m = new PlotlyExpressChartModel(dh, widgetData, fetch); setModel(m); + setWidgetRevision(r => r + 1); return m; }, [dh, fetch]); @@ -26,6 +28,7 @@ export function PlotlyExpressChartPanel(props: WidgetPanelProps) {