🚀 Gen 5 of the leading AI app deployment platform launches October 6. Click for the livestream.

Graphs only resizing in IExplorer, not Chrome

Hi,

I’m new to Dash/Plotly, and I have made a web app that plots some stuff:

I’ve created a plot like this:

dcc.Graph(className=‘column’, id=‘trace_raw’)

and the control code something like this:

@app.callback(Output(‘trace_raw’, ‘figure’),
[Input(‘currentData’, ‘data’)])
def updateRawChart(currentData):
return {‘data’: [go.Scatter(x=x_points,
y=experiment_data[0],
name=‘330 nm’
),

                 go.Scatter(x=x_points,
                            y=experiment_data[1],
                            name='350 nm'
                            )
                 ]
        }

It looks good, BUT:

  • In Internet Explorer 11, when I change the width of the browser window, the plots resize as expected.
  • In Chrome 71.0.3578.98, When I increase the browser width, the plots expand to as expected. When I decrease the browser width, the plots don’t resize, and get clipped off the side window.

Just to note: There is a second plot on the same div. Would this be causing the issues?

EDIT: Yes, when I seperate the plots onto seperate lines, they shrink correctly in both IExplorer and Chrome. But how do I get both on the same line working in Chrome?

Any tips on a fix?