Plotly: How to avoid drag on x axis

Question

I need to prevent the dragging on the x axis (the one that moves the axis and its curves), but without loosing the zoom feature (selecting an area on the graph). I've found exactly this question on Plotly forum, but there aren't answers.

Copying the text for convenience:

I want to keep this functionality:

But I want to disable this:

My attempt was:

fig.update_layout({
            'xaxis': {'fixedrange': True},
            'xaxis2': {'fixedrange': True},
)}

This snippet blocks the x axis drag as well as the zoom. Selecting fixedrange for only one of the axis blocks the dragging but the zoom goes bugged (zooming only the curves of one of the axes). Is there any way with plotly arguments or maybe by CSS (by adding a css file on assets folder), by preventing the click on the axis based on the id and maybe the children.

Answer 1

According to the js and python config docs, the complete list of configuration options are available at the plotly.js source code on GitHub: https://github.com/plotly/plotly.js/blob/master/src/plot_api/plot_config.js

Search for showAxisDragHandles:

showAxisDragHandles: {
    valType: 'boolean',
    dflt: true,
    description: [
        'Set to *false* to omit cartesian axis pan/zoom drag handles.'
    ].join(' ')
},

Usage :

config = dict(showAxisDragHandles=False)

# plotly.py
fig.show(config=config)

# plotly-dash
graph = dcc.Graph(figure=fig, config=config)