search

allen-cell-animated / volume-viewer

https://allen-cell-animated.github.io/volume-viewer/
Other
92 stars 7 forks source link

show scale bar #66

Closed toloudis closed 1 year ago

toloudis commented 2 years ago

Use Case

Users may be interested to know the physical spatial dimensions of the volume.

Solution

In 2d modes, can show scale bar as a ruler in the corner. Ruler value should be updated with zoom in / out. In 3d perspective view, scale bar could be represented as tickmarks on bounding box lines, along with a ruler in the corner. Needs a bit of spec to work out details, probably.

Implementation detail: can the ruler be html that floats above canvas? that would probably be ideal rather than rendering webgl text for the numbers.

toloudis commented 2 years ago

This task could/should be split into two, one for 2D and one for 3D modes since they will be very different.

toloudis commented 1 year ago

need to add unit support to Volume object. look for npm units libraries we could use. at volume load we need to find the unit in the metadata and apply a default if missing (microns?)

toloudis commented 1 year ago

TBD: where to put the ruler on screen? @lynwilhelm think about how this interacts with clipping drawer and axes display, and maybe reference simularium for bounding box tickmarks and ruler iconography

toloudis commented 1 year ago

Is this properly put in volume-viewer as opposed to website-3d-cell-viewer? There may be some interplay between the two. Should there be a show/hide rulers toggle?

frasercl commented 1 year ago

The ruler is currently in volume-viewer as an additional div element injected into ThreeJsPanel.containerdiv. I think it definitely makes sense to have the option to disable the ruler in the volume-viewer API, but I'm not sure if it's obtrusive enough to be worth adding UI to get rid of it, especially given that the 3d mode version might be somewhat entangled with the bounding box and its button.

Now may also be the time to address allen-cell-animated/website-3d-cell-viewer#73 with some way to set a box for elements that live in corners, i.e. minimally View3d.setInfoElementBox(box: [number, number, number, number]): void. The scale bar, if placed right in the bottom-right corner, would land directly under the "clipping" button.