Live Examples

Every panel below runs the Orbitron WASM viewer in your browser. Left-drag to rotate, Shift+left-drag (or a middle- or right-drag) to pan, scroll or use − / + to zoom, and choose Reset to return to the framed pose. The bindings are the desktop viewer’s, and Shift+drag is the one a trackpad can perform. WebGPU is used when available, with a WebGL2 fallback.

Each viewer has its own iframe. The WASM runtime is a page-level singleton, so placing several <orbitron-viewer> elements directly in one document causes them to compete for the same render state. An iframe gives each scene its own JavaScript and WASM context while the browser still caches the shared assets.

Buckminsterfullerene (C₆₀), ball-and-stick

MgAl₂O₄ spinel, periodic unit cell

Water antisymmetric stretch, generated from displacement vectors

Copper complex, geometry-optimisation trajectory

Ferrocene LUMO, positive and negative isosurface lobes

Ubiquitin (1UBQ), secondary-structure cartoon

Protein-DNA complex (1JGG), two protein chains bound to a 10-base-pair duplex

GROMACS XTC frame 3, paired with GRO topology and exported as a portable snapshot

EMD-3001, experimental MRC2014 density at its header-derived contour

The last three examples come from the same attributed fixtures used by the biology, GROMACS, and density-map regression gates. The protein-DNA bundle retains the deposited chain and residue identity. The GROMACS card is a single portable frame because binary XTC still needs its topology during multiframe access. The map bundle retains the normalized voxel grid, placement, source digest, and contour without embedding the original MRC file.

Surface styles

A grid can open as more than an isosurface. Each bundle below records how its grid is drawn, so it opens the same way in the desktop viewer, in orbitron render, and in a page like this one.

Water’s electrostatic potential on its 0.001 au density surface: negative (red) over the oxygen, positive (blue) over the hydrogens

Ferrocene’s LUMO as fog: the orbital’s density, |ψ|², ray-marched through the grid, so its lobes fade rather than end at a contour

The methyl radical’s singly occupied p orbital as 20,000 points scattered by |ψ|², coloured by the sign of ψ

One of N₂’s two π* LUMOs as a wireframe, with the triple bond visible inside

Each is one canonical export of the grid with a flag naming the style. The sources are fixtures in the repository; scripts/generate-docs-scenes.sh writes these four exactly.

# Electrostatic potential: a density, a potential cube, and colour by the second
orbitron cube water_orbitals.fchk --density -o water-density.cube
orbitron canonical export water-density.cube water_potential-scf.cube \
  --isosurface 0.001 --colour-by-grid 1 --colour-range 0.05 -o water-esp.orbpack

# Fog, at full strength where the orbital reaches 0.03
orbitron canonical export ferrocene.out --mo 48 --movecs ferrocene_from_frag.movecs \
  --volume --isosurface 0.03 -o ferrocene-fog.orbpack

# A point cloud
orbitron canonical export ch3_uhf_alpha5.cube --dots 20000 -o methyl-somo.orbpack

# A wireframe
orbitron canonical export n2-ccsd-charge.out --mo 7 --movecs n2.movecs \
  --isosurface 0.05 --wireframe -o n2-wireframe.orbpack

--mo evaluates an orbital from the wavefunction when the source has no grid (NWChem needs its .movecs for the full coefficients). In the desktop viewer the same styles are the Draw as choices on a row of the Analysis panel’s Surfaces tab, and the CLI guide lists every flag.

Reproduce the biology, MD, and density examples

The repository includes one small runner that writes inspectable JSON/CSV, PNG, GRO, and .orbpack outputs:

CARGO_BUILD_JOBS=12 conda run --no-capture-output -n orbitron-dev \
  cargo build --release -p orbitron-cli
examples/biology-and-md/run.sh all

Run structure, trajectory, density, or figure instead of all for one case. The default output goes to ~/scratch/orbitron-biology-and-md-examples. Its structure case runs on the 3BKF mmCIF fixture, not on the 1JGG protein-DNA bundle in the gallery above; trajectory and density use the same GROMACS and EMD-3001 fixtures as their cards. figure renders a binding-site figure from 1UBQ — the fold as a pale ribbon, the site in sticks, residues labelled — and the same scene as a plain ribbon, which is the render flag set of the CLI guide’s §4.3.1 run end to end. See examples/biology-and-md/README.md for the exact fixture provenance and output contract.

Reproduce a publication-style binding-site panel

The focused 4TPO P450 recipe is separate because it produces a working figure bundle rather than one anonymous PNG. It retains the camera, pale context ribbon, amber heme and L-tryptophan, labelled pocket residues, ordered waters, and dashed polar contacts:

examples/publication-figures/run.sh p450

The output is 6-p450-active-site.orbpack under ~/scratch/orbitron-figure-examples by default. Open it in the desktop viewer for the final raster export, or use it directly in an iframe for an interactive supplement. The recipe is deliberately a set of named selection groups, so a different camera or revised residue list is a small script edit rather than a new hand-made scene. See the publication-figure README for the exact composition and the chemistry caveat on polar contacts.

Make your own

import orbitron

orb = orbitron.Orbitron()
scene = orb.load("your_structure.cif")
orbitron.export_html(
    scene,
    "viewer.html",
    lighting="Studio",
    appearance="presentation",
)

That output is one portable HTML file. A bundle keeps more than a Scene can: normal modes, trajectory frames, volumetric grids, and a recorded view. Pass the bundle path directly when those sections matter:

orbitron.export_html("run.orbpack", "run.html")

For pages with several viewers, use one iframe per scene as this gallery does. The web-embedding guide covers the hosted bundle layout, URL controls, and direct custom-element API. The Python guide covers Jupyter display and scripting.