jketreno/backstory
1
0
Fork 0
Code Issues 12 Actions Releases Activity

Resize Plotly after load

Browse Source
This commit is contained in:
James Ketr 2025-04-26 18:15:05 -07:00
parent 9875b58af7
commit f7628f87d6
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/VectorVisualizer.tsx
View File

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react';
import React, { useEffect, useState, useRef } from 'react';
import Box from '@mui/material/Box';
import Card from '@mui/material/Card';
import Typography from '@mui/material/Typography';
@ -107,6 +107,7 @@ const VectorVisualizer: React.FC<VectorVisualizerProps> = (props: VectorVisualiz
const [newQueryEmbedding, setNewQueryEmbedding] = useState<ChromaResult | undefined>(undefined);
const [result, setResult] = useState<ResultData | undefined>(undefined);
const [view2D, setView2D] = useState<boolean>(true);
const plotlyRef = useRef(null);
const [tooltip, setTooltip] = useState<{
visible: boolean,
// x: number,
@ -145,6 +146,9 @@ const VectorVisualizer: React.FC<VectorVisualizerProps> = (props: VectorVisualiz
/* Trigger a resize event to force Plotly to rescale */
useEffect(() => {
window.dispatchEvent(new Event('resize'));
if (plotlyRef.current) {
Plot.Plots.resize(plotlyRef.current);
}
}, [])
useEffect(() => {
@ -328,15 +332,17 @@ const VectorVisualizer: React.FC<VectorVisualizerProps> = (props: VectorVisualiz
<FormControlLabel
sx={{
display: "flex",
position: "absolute",
position: "relative",
width: "fit-content",
ml: 1,
mb: '-2.5rem',
zIndex: 100,
flexBasis: 0,
flexGrow: 0
}}
control={<Switch checked={!view2D} />} onChange={() => setView2D(!view2D)} label="3D" />
<Plot
ref={plotlyRef}
onClick={(event: any) => {
const point = event.points[0];
console.log('Point:', point);