Skip to content

Implement zoom and horizontal scrolling for sequence views #34

Open
@ivan-aksamentov

Description

@ivan-aksamentov

I imagine it to be like Google Maps navigation but in 1 dimension.

Need to figure out what's the best user experience here would be, because vertical scrolling is an important part of the table widget (and should take precedence).

We may for example enable zoom when holding Ctrl
UPDATE: Ctrl would not work, because Ctrl + Mouse wheel triggers browser zoom.

We all know Ctrl-to-zoom is much more annoying than modifier-less zoom, so alternatively (or additionally to), we might have a button to toggle Ctrl modifier requirement (enable/disable "zoom mode")

In any case there should also be buttons for zoom in, zoom out, scroll left scroll right which move the viewport by a given amount of pixels.

Implementation should be aware of screen width, mobile clients. OS differences should be take into account (What was that "different" Ctrl key on Mac again?)

This should not conflict with zoom or other features in browsers or commonly used browser addons.

Completely different approach could be to just rip-off a system that Nextstrain uses in Entropy/Diversity section, however there might be some unexpected challenges, because we may have a lot of rows we and I expect d3.js to be extremely slow. React reimplementation of this feature may be fine though.

Related: scrollable container feature #35

Metadata

Metadata

Assignees

No one assigned

    Labels

    good first issueGood for newcomershelp wantedExtra attention is neededt:featType: request of a new feature, functionality, enchancement

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      close