Data and layout changes are lost while the plot is initializing

Abierto Apto para principiantes
  • ¿Algo no está bien?
#373 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
2/5
Tiempo estimado
1-3 horas
Aptitud para principiantes
76/100
Tipo de issue
Error
Claridad
Bien especificado
Estado de actividad
Activo
Stack tecnológico
angular, typescript
Área
frontend

Línea de trabajo

Empieza por PlotlyComponent.ngDoCheck y la ruta de inicialización que llama a Plotly.newPlot; el issue señala el diff consumido y la actualización que falta mientras plotlyInstance es undefined. Sigue cómo se resuelve la inicialización y cómo se aplican las actualizaciones; después, añade cobertura para los casos en que los datos o el diseño cambien antes de que se resuelva newPlot. El objetivo es que el gráfico muestre las entradas más recientes después de la inicialización sin necesitar otro cambio.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Description

PlotlyComponent drops [data] and [layout] changes that arrive before Plotly.newPlot resolves. The chart keeps showing the initial input until another change happens later.

The window is easy to hit with PlotlyViaCDNModule or PlotlyViaWindowModule, where newPlot waits for plotly.js to load, and with traces whose newPlot is asynchronous. A typical case is a chart that starts with [data]="[]" and receives data from an HTTP request that completes before plotly.js finishes loading.

Cause

ngDoCheck detects the change, which consumes the differ's diff, but only calls updatePlot() when plotlyInstance is set. During initialization plotlyInstance is still undefined, so the update is skipped. newPlot was already called with the old input, so the newer input is never drawn.

Steps to reproduce
  1. Load plotly.js through PlotlyViaCDNModule.
  2. Render <plotly-plot [data]="data"></plotly-plot> with data = [].
  3. Set data to a new array before the CDN script finishes loading (for example, from a fast HTTP response or a setTimeout(..., 0)).

Expected: the chart shows the new data.
Actual: the chart stays empty until data or layout changes again.

Affected versions

v20, v21, and master (same code in ngDoCheck).

Lenguaje dominante
TypeScript
Estrellas
242
Forks
81
Merge medio
23 h 52 min
PR fusionados (30 d)
5

Preparar el entorno

Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de plotly/angular-plotly.js

Todos los issues de plotly/angular-plotly.js

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.