Skip to content

Data and layout changes are lost while the plot is initializing #373

Open

Description

@RaphaelFakhri

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).

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions