Black Lives Matter. Please consider donating to Black Girls Code today.
Dash Enterprise delivers an incredible 21x cost savings 💸Download the e-book!

Autoscale automatic does not work!

Team Plotly,

I am using ReactJS to prepare a Dashboard. Each component on the Dashboard is a different type of graph, as shown below:

The problem is with the Scatter/Line plot at the bottom. When the page loads, the Scatter plot is blank with the axes centered at (0,0), whereas my actual data points start around (18.2, 10). I have to manually click on the autoscale button on the Scatter graph to make it look like the image shown above.

One of the posts in the forum suggested using relayout as shown below.

This does not seem to work in my case!

code: https://github.com/dineshauti/ReactDashboard/blob/master/src/components/scatter.js

Any help would be appreciated :slight_smile:

This is just a guess, but I might try importing Plotly by its npm package (instead of the CDN in your index.html)?

Like this:

Thanks for the feedback Jack!
Get this error:

Got rid of the above error. The code compiles but with a warning:

Hi Dinesh, we cloned your repo and the HTTP request for fetching the data didn’t work, have you got a branch that has mock data i.e. no external dependency? Even better if you can isolate the specific chart and just pass on a mock {data: […], layout: {…}} example i.e. a minimally reproducing problem case with a couple of data points.

1 Like