insightsoftwareconsortium / itk-viewer-bootstrap-ui Goto Github PK
View Code? Open in Web Editor NEWA UI frontend based on React Bootstrap
Home Page: https://itk-viewer-bootstrap-ui.readthedocs.io/
License: Apache License 2.0
A UI frontend based on React Bootstrap
Home Page: https://itk-viewer-bootstrap-ui.readthedocs.io/
License: Apache License 2.0
With an intensity image and a label image and a short viewer height, the elements go beyond the viewer. Perhaps we should scroll in this case? Or something better? Observed with itkwidgets. @PaulHax could you please take a look?
jsdelivr: Package size exceeded the configured limit of 100 MB.
With the latest itkwidgets (and itk-vtk-viewer, itk-viewer-bootstrap-ui), slider clicks are not registered:
The widget now shows up with a gray background. It should not be there when not necessary (as in the original version of the viewer).
actorContext.image.scaleInfo[actorContext.renderedScale].ranges[actorContext.selectedComponent]
is undefined for some datasets (e.g., astronaut.zarr)
Global state object should not have references to UI elements. But we may want dark mode and thats how its implemented now with performance impacts. Make a plan for this.
index.html
examples)The original app shows the Index, Position and Value as we drag the mouse over the 3D object (Volume [4]
mode). We could recover such feature for this version of the app.
We need that cropping goodness! ๐ฅง
App startup is slow, and sliders are laggy.
We are re-rendering the whole component tree on any state change. With useSelector
we should avoid that.
When parent components are sorted, check SampleDistanceSlider #10 (comment)
Or just displaced enough from the bottom so it does not overlap with the slice sliders.
I do not recall whether this needs to happen in itk-vtk-viewer or here.
The shortcuts do not work when the user is interacting with the image.
To reproduce the issue:
p
. This works as expected --- the object spins in 3D;p
. This does not work as expected ---the object does not spin in 3D.Expected behavior: all shortcuts should work in situations 2) and 4) .
When we click a "toggable" button like "Spin in 3D" the button takes focus, the background is light gray, and the button is toggled. Clicking the button again toggles the button, but the appearance does not change (because we are using dark gray background to indicated "isClicked" and the focus light gray background takes precedence.) Every time a button is clicked, we want the down/up feedback and its "isClicked" state to be visible.
The "annotation" button in commit 08aaa09 is almost there. 2 issues:
Lets make all our buttons constant with slightly modified "annotaiton" button above. Or something different? Open to ideas. Only big divergence from the react-bootstrap ToggleButton feel is the hover effect to avoid interfering with the "is checked" state:
https://react-bootstrap-v4.netlify.app/components/buttons/#checkbox--radio
as soon as it gets launched
Because 'labelImageWeights' is 'Map(0)'
docs
directory this repositoryRight now, when loaded a 2D image, the viewer show the 3D volume rendering view.
When loading a 2D image, just show the 2D (Z slice) view right away. Hide the XYZ/Volume view changing buttons, hide the slice scrub sliders on the bottom.
Right now we use the local host 8082. This should be changed as soon as the data is available in Datalad.
Try a version released after Apr 12, 2021, which was when the Offcanvas
component was added. This would be a better component to use as a drawer in the Panel.jsx
After commit b0e8aec, when I run npm run dev
I get the error:
failed to load config from /home/local/KHQ/laryssa.abdala/sfw/itk-viewer-bootstrap-ui/vite.config.js
error when starting dev server:
Error: Cannot find module 'vite-plugin-css-injected-by-js'
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.