decolace_web_viewer

A web-based viewer for DeCo-LACE data.

Click here for an example dataset

Description of pipeline

• Images are rendered in blender at high resolution (~25kx25k). The montaged micrograph is imported as a tiff texture and molecules are imported using Molecular Nodes.

  • Every dataset is one scene in the blenderfile. The micrograph and molecular overlay layers are ViewLayers within the scene. The compositor is used to save them all into seperate files.
  • There is a custom renderscript that uses renderregions to break the rendered image up into 4 quadrants. Otherwise the compositor crashes even on machines with a lot of RAM (512GB).
  • The orthographic scale of the camera is driven by a driver based on the render resolution. That ensures a constant pixel-size.
  • The rendered quadrants are placed into a folder called "output"
  • An example .blend file with the nescessary data can be downloaded here

• The script assemble_dzi.py is used to assemble the quadrants and then write out image pyramids in dzi format.

• The script optimize_png.sh is used to optimize the filesize of the dzi image pyramid (from ~1GB to 250MB)

• The resuting dzi files are uploaded to a static hosting service.

• The webapp in this repo can read specifications in json format to display the dzi files. Example

Recommended IDE Setup

VSCode + Volar (and disable Vetur) + TypeScript Vue Plugin (Volar).

Customize configuration

See Vite Configuration Reference.

Project Setup

pnpm install

Compile and Hot-Reload for Development

pnpm dev

Compile and Minify for Production

pnpm build

Lint with ESLint

pnpm lint