search

finos / perspective

A data visualization and analytics component, especially well-suited for large and/or streaming datasets.
https://perspective.finos.org/
Apache License 2.0
7.72k stars 1.05k forks source link

UI: Floating toolbar labels. #2561

Closed brianblakely closed 1 month ago

brianblakely commented 3 months ago

Issue

When hovering over the viewer toolbar, button width changes and shifts the position of buttons onscreen. This can be problematic if you hover over a toolbar button en-route to, for example, the theme picker, as illustrated below. In the diagram, X1 is the original distance from the plugin selector to the theme picker, and X2 is the new distance after hovering over another toolbar button en route.

psp_orig

psp_orig2

Proposed Solution

Instead of rendering button labels inline, render them floating below the toolbar buttons. This floating system works with the theme picker dropdown as well.

psp_float

https://github.com/finos/perspective/assets/401422/16db7b31-8f2f-40c2-8080-d80f75db2ba7

texodus commented 1 month ago

@brianblakely Thanks for the PR!

I've cherry-picked these commits into #2618 (1acea92), with a few modifications, a slightly different presentation, and I've reverted the Theme button changes as this dropdown specifically is particularly hairy to use in float position as you must hover the mouse through a narrow gauntlet to arrive on a clickable surface.

https://github.com/finos/perspective/assets/60666/04582e5c-f52a-4ab2-a3e9-3975adf7d869

2618 has already been merged and will be in the 3.0 release.