react-diagrams icon indicating copy to clipboard operation
react-diagrams copied to clipboard

Scroll Zoom in Firefox / Adjust zoom sensitivity

Open lukethacoder opened this issue 4 years ago • 6 comments

Zooming in Firefox still seems to be broken?

Would a more future proof solution be adding a zoomSensitivity prop to the <DiagramWidget/>?

Even as browsers change their behavior and being cross compatible, you could dynamically change the zoomSensitivity level based on the browser.

const zoom_sensitivity = 1.2;

<DiagramWidget
  zoomSensitivity={zoom_sensitivity}
  diagramEngine={this.engine}
/>

lukethacoder avatar Jul 10 '19 13:07 lukethacoder

Following up here:

Do we think that the issue is cross browser entirely or is there a system component? I.e., is it feasible to add code to autodetect the correct zoom sensitivity, or will certain systems+browser combos always be wonky?

JeremyRubin avatar Jan 10 '20 17:01 JeremyRubin

Has there been any info about this? As far as I can tell it's still slow on firefox and I can't seem to figure out if there's a way to change sensitivity yet?

Blackpinned avatar Feb 25 '20 16:02 Blackpinned

@Blackpinned I've found a solution to this, as I posted here: https://github.com/projectstorm/react-diagrams/issues/516#issuecomment-572021438.

I'm not sure if this is a good solution, and that's why I haven't opened a pull request with these changes... but you could apply them to your project if you really need.

renato-bohler avatar Feb 26 '20 00:02 renato-bohler

In case anyone needs some guidance, I've implemented a custom zoom action that allows only for a limited number of zoom levels. You can check out the code in this commit: https://github.com/renato-bohler/logossim/pull/22/commits/dbc1b8b8a804d4c2974d1e5cf86d039ef32f6acc

renato-bohler avatar Apr 02 '20 01:04 renato-bohler

Hoping to bump this issue a bit :) I would love to see the solution @renato-bohler offered in #516 pulled in. Current behavior in Firefox is really a pain for me..

GKooijmans avatar Feb 18 '21 15:02 GKooijmans

What's this <DiagramWidget>? I cannot find it in the react-diagrams repo, and it's not in the demos.

aaron-michaux avatar Oct 18 '21 15:10 aaron-michaux