Disable Diagonal Selection on cartesian zoombox drag

[AdnanBoota]

Hi Team Plotly,

I would like to enable the horizontal and vertical axis selection on bar/line charts, but I want to disable the diagonal selection – i.e. I don’t want to user to simultaneously select both axis, but only one at a time.

I have tried different solutions, but I could not get the desired effect. For example, setting fixedrange:true, disables either vertical or horizontal selection. But, I want to disable only diagonal selection, and keep both horizontal and vertical selections enabled.

Is it possible to have this feature for diagonal selection, like diagonalFixedRange:true? or have a flag to disable just the diagonal selection?

I'm using this library in ReactJS, the Plotly.js update will also ReactJS package?

Thank you very much for you help and the wonderful library 😊.

[etpinard]

Thanks for writing in!

By select here I suspect you mean "zoombox" (as set via layout.dragmode: 'zoom'). In this case to achieve what you're looking for, we would probably need to either add an attribute similar to selectdirection but for dragmode: 'zoom' or expose some of these drag-zoom constants:

https://github.com/plotly/plotly.js/blob/f66aff377892ae62ccd1553197d86f09bffd27fa/src/plots/cartesian/constants.js#L35-L42

[AdnanBoota]

Hi etpinard,

Thanks for your quick response :)

Yes, you are right, it's in dragmode: 'zoom' which is the default behavior, and yes it would be great if you can add an attribute similar to selectdirection for dragmode: 'zoom'.

Would it be possible to have an attribute to just enable/disable diagonal-selection? because the x-axis, y-axis selections are working perfectly with fixedrange:true, just only need to enable/disable diagonal.

plotly.js/src/plots/cartesian/constants.js

The MINZOOM constant, can also help for setting the threshold of selection, if easier, i would just only need MINZOOM for setting the threshold of diagonal-selection?

Again Thanks! Adnan

[josephernest]

Thanks @etpinard. Does anyone know if it is possible nowadays to only allow "d" (=diagonal=rectangular box zoom=no horizontal/no vertical zoom) also for dragmode: 'zoom' ? @alexcjohnson

If not already possible, is there a dirty hack / monkeypatching to disable horizontal or vertical zoom ? And only allow rectangular (=diagonal) zoom?

Maybe a modification of MINSELECT or MINDRAG?

[alexcjohnson]

@josephernest this feature has yet to be implemented and I'm not aware of any hacks to achieve your goal. We'd be happy to accept a PR adding a zoomdirection attribute.

[josephernest]

@alexcjohnson I'll look at this! Do you think that setting one of these to value 1 would do it?

 // pixels to move mouse before you stop clamping to starting point 
 MINDRAG: 8, 

 // smallest dimension allowed for a select box 
 MINSELECT: 12, 

 // smallest dimension allowed for a zoombox 
 MINZOOM: 20, 

[alexcjohnson]

I kind of doubt it, but anyway the setting needs to be per-plot, so it would need to be applied at the point of use rather than in this constants file. I think we just need to find the logic around choosing x vs y vs d and have it ignore the disallowed flavors.

BTW I gather @AdnanBoota has moved on, but if we want to support the original use case zoomdirection would need a value xy in addition to x, y, and d.