Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

Restyle Axis JS

I am trying to restyle a scatter plot I have with Plotly JS and I cant seem to get it working. All I need to do is to be able to switch between normal and logarithmic axes.

I can switch to log just find with something like this:
var update10 = { xaxis: { type: 'log', autorange: true }, }; Plotly.relayout('myDiv', update10);

However, I can not switch back to normal axis. The autorange does not work what so ever and I am left with only the beginning portion of my data.

For example in this codepen: http://codepen.io/anon/pen/zNgXWG?editors=1010
If you uncomment the last relayout which sets the x-axis type to “-” which is the default, and autorange = true (also default), the range is messed up!

How do I set the axis back to normal and get the autorange to actually work? Any help is appreciated.

Try http://codepen.io/etpinard/pen/KWPrYZ

Notice the different update signatures:

  • in your example, you call Plotly.relayout('graph', 'xaxis', {/* /*}), which replace the entire xaxis container with a new one.
  • in the codepen, Plotly.relayout('graph', 'xaxis.type', 'log'), only replace the axis type and gets the desired result.
1 Like