plotly / plotly/react-plotly.js
ranges does not get computed when same data is used but Plot is updated
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- JavaScript
- Estrellas
- 1.1k
- Forks
- 138
- Merge medio
- 3 d 2 h
- PR fusionados (30 d)
- 4
Descripción
If layout is change but data stays the same, Plot's ranges are not computed correctly.
Consider this React component
(full project can be found here: https://github.com/saad-learns/react-plotly/tree/same_data
function App() {
const [plotUpdated, setPlotUpdated] = React.useState<number>(0);
const [plotParams, setPlotParams] = React.useState<PlotParams>({
data: [
{
x: [-3, -2, -1, 0, 1, 2, 3],
y: [
-0.1411200080598672, -0.9092974268256817, -0.8414709848078965, 0,
0.8414709848078965, 0.9092974268256817, 0.1411200080598672,
],
},
],
layout: {},
});
const updatePlot = () => {
setPlotParams((prevState) => ({
data: prevState.data,
layout: {},
}));
};
return (
<div className="App">
<div style={{ padding: 10 }}>
<button onClick={updatePlot}>Update Plot</button>
</div>
<Plot
data={plotParams.data}
layout={plotParams.layout}
onUpdate={() => setPlotUpdated((prevState) => prevState + 1)}
/>
<div>Plot updated: {plotUpdated}</div>
</div>
);
At the start, ranges are calculated correctly. You can verify that with React Dev Tool's Component tab:
Or you can use Zoom In and Zoom Out button to verify that zooming is working.
But if you click on the Update Plot button, the ranges are not computed, in fact they get removed:
Thereafter, zooming does not work.
Here, updatePlot will use the same data object, but makes use of a new layout. According to https://github.com/plotly/react-plotly.js#refreshing-the-plot Plot should be refreshed, and it does, but ranges are no longer computed correctly.
There are other variation of the above issue:
- Use a new array but same previous data element: https://github.com/saad-learns/react-plotly/blob/new_array/src/App.tsx
- Use a new array, and a new element but with same previous data: https://github.com/saad-learns/react-plotly/blob/new_object/src/App.tsx
where ranges are not computed properly.
Guía de contribución
No hay ninguna guía de contribución indexada para este repositorio
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Comienza con la reproducción same_data enlazada y sigue la ruta de actualización del componente Plot cuando cambia el layout, pero se reutilizan los datos. Compara las variantes new_array y new_object para identificar el comportamiento compartido. Se considera terminado cuando los ranges siguen calculándose y el zoom sigue funcionando después de hacer clic en Update Plot.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript, plotly, react
- Área
- data-visualization, frontend
- Tipo de issue
- Error
- Dificultad
- 3/5
- Tiempo estimado
- 1-2 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 48/100