DataJoint™ powered visualization that adapts to your workflows

Features

Visualization that can keep up with changing needs of your lab
Standardized YAML build specification providing a Low-Code web application design experience
Transport-optimization by leveraging client-side rendering with React
Python+DataJoint interoperability to allow streamlined integration
Clear separation between business logic from product features i.e. customization through configuration
Backend-optimized page rendering built for big-data and scale
Comprehensive permission and security design enabling flexible access control modes
Securely manage sensitive information by configuring it separtely and referencing it in LC spec
Pain-free deployments by supporting live-reload on changes to configuration
Shared, immutable global variables available to all components

markdown: Often it is necessary to document or describe views via Markdown
page:
- Unique tabbed pages to separate areas within your single-page application
- Hidden pages accessible through linking from records in table components
grid: Layout structure for organizing subcomponents (as seen in Grafana, AWS Console)
- fixed: For when you know exactly how many components you'd like to render
- dynamic: Component templating mode when you need to render realtime views that vary in number of components
table: Sometimes there's nothing better than a table view
- paging
- sorting
- filtering
metadata: Great for showing context info for particular views
plot: Let's face it, we are going to need to be able to plot stuff
- plotly
image: When you need to render an image file's data directly within the grid
- *.apng
- *.avif
- *.gif
- *.jpeg
- *.png
- *.svg
- *.webp
custom: Adding new, custom components is easy with our extensibility hook. See our currently supported components here which you can reference when creating your own.

The recommended environment to run the demo is included as a DevContainer.

Here are some options that provide a great demo experience:

Cloud-based IDE: (recommended)
- Launch using GitHub Codespaces using the option Create codespace on main in the codebase repository on your fork.
- Build time for a 2-Core codespace is ~6m30s. This is done infrequently and cached for convenience.
- Start time for a 2-Core codespace is ~3m. This will pull the built codespace from cache when you need it.
- Tip: GitHub auto names the codespace but you can rename the codespace so that it is easier to identify later.
Local IDE:
- Ensure you have Git
- Ensure you have Docker
- Ensure you have VSCode
- Install the Dev Containers extension
- git clone the codebase repository and open it in VSCode
- Use the Dev Containers extension to Reopen in Container (More info in the Getting started included with the extension)

You will know your environment has finished loading once you see a terminal open related to Running postStartCommand with a final message: Done.

To access SciViz, use the VSCode PORTS tab (next to TERMINAL) to manage access to the forwarded ports. SciViz will be served on port 443.
This interactive environment sets up a developer experience where on saves to sciviz_spec.yaml, SciViz will automatically reload the page to reflect your changes.
Tip: Take care to save only when specifying valid configuration for SciViz. If you save aggressively, this could cause the underlying services to break since each save triggers a reload.