# ucsc-xena-viv > High bit depth, high resolution, many channels, low overhead Latest version **0.12.8-3** (published 2022-06-16) · MIT license · 0 weekly downloads ## Install ```sh npm install ucsc-xena-viv pnpm add ucsc-xena-viv yarn add ucsc-xena-viv bun add ucsc-xena-viv ``` ## Health **Score 30/100 (F)** — status: abandoned. Positive: has types; esm support; no vulnerabilities; high quality score. Warnings: low downloads; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.12.8-3 | | Published | 2022-06-16 | | First published | 2022-05-23 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 8 | | Unpacked size | 1.1 MB | | Known vulnerabilities | 0 (+2 in 1 direct dependencies) | | Install scripts | no | | GitHub stars | 0 | | Author | Ilan Gold | | Maintainers | acthp | ## Links - npm: https://www.npmjs.com/package/ucsc-xena-viv - Repository: https://github.com/ucscXena/viv - Homepage: https://github.com/hms-dbmi/viv#readme - Issues: https://github.com/hms-dbmi/viv/issues - npm.io page: https://npm.io/package/ucsc-xena-viv ## Dependencies (8) - [zarr](https://npm.io/package/zarr.md) ^0.5.1 - [math.gl](https://npm.io/package/math.gl.md) ^3.3.0 - [quickselect](https://npm.io/package/quickselect.md) ^2.0.0 - [fast-deep-equal](https://npm.io/package/fast-deep-equal.md) ^3.1.3 - [fast-xml-parser](https://npm.io/package/fast-xml-parser.md) ^3.16.0 - [@math.gl/culling](https://npm.io/package/@math.gl/culling.md) ^3.4.2 - [lzw-tiff-decoder](https://npm.io/package/lzw-tiff-decoder.md) ^0.1.1 - [ucsc-xena-geotiff](https://npm.io/package/ucsc-xena-geotiff.md) ^2.0.5-2 ## Recent versions - 0.12.8-3 (latest) — 2022-06-16 - 0.12.8-2 — 2022-06-16 - 0.12.8-1 — 2022-05-23 - 0.12.8 — 2022-05-23 ## README # Viv [![npm version](https://badge.fury.io/js/%40hms-dbmi%2Fviv.svg)](https://badge.fury.io/js/%40hms-dbmi%2Fviv) [![package documenation](https://img.shields.io/badge/package-documentation-blue)](http://viv.gehlenborglab.org) A WebGL-powered toolkit for interactive visualization of high-resolution, multiplexed bioimaging datasets.

Interactive volumetric view in web browser; sliders control visible planes. Multi-channel rendering of high-resolution microscopy dataset

## About Viv is a JavaScript library for rendering OME-TIFF and OME-NGFF (Zarr) directly in the browser. The rendering components of Viv are packaged as [deck.gl](https://deck.gl) layers, making it easy to compose with [existing layers](https://deck.gl/docs/api-reference/layers) to create rich interactive visualizations. More details and related work can be found in our preprint. Please cite this preprint in your research: > Trevor Manz, Ilan Gold, Nathan Heath Patterson, Chuck McCallum, Mark S Keller, Bruce W Herr II, Katy Börner, Jeffrey M Spraggins, Nils Gehlenborg, > "[Viv: Multiscale Visualization of High-resolution Multiplexed Bioimaging Data on the Web](https://osf.io/wd2gu/)." > **OSF Preprints** (2020), [doi:10.31219/osf.io/wd2gu](https://doi.org/10.31219/osf.io/wd2gu) ## 💻 Related Software | Screenshot | Description | :-------------------------:|:-------------------------: Avivator viewer running in Chrome | [**Avivator**](http://avivator.gehlenborglab.org)
A lightweight viewer for local and remote datasets. The source code is include in this repository under `avivator/`. See our [🎥 video tutorial](https://www.youtube.com/watch?v=_GES8BTzyWc) to learn more. Vizarr viewer running in Jupyter Notebook | [**Vizarr**](https://github.com/hms-dbmi/vizarr)
A minimal, purely client-side program for viewing OME-NGFF and other Zarr-based images. Vizarr supports a Python backend using the [imjoy-rpc](https://github.com/imjoy-team/imjoy-rpc), allowing it to not only function as a standalone application but also directly embed in Jupyter or Google Colab Notebooks. ## 💥 In Action - [Vitessce](http://vitessce.io) visualization framework - HuBMAP Common Coordination Framework Exploration User Interface ([CCF EUI](https://github.com/hubmapconsortium/ccf-ui)) - OME-Blog [OME-NGFF](https://blog.openmicroscopy.org/file-formats/community/2020/11/04/zarr-data/) and [OME-NGFF HCS](https://blog.openmicroscopy.org/file-formats/community/2020/12/01/zarr-hcs/) announcements - ImJoy [I2K Tutorial](https://imjoy.io/docs/#/i2k_tutorial?id=open-integration-with-imjoy) - Galaxy Project includes Avivator as [default viewer for OME-TIFF files](https://docs.galaxyproject.org/en/release_21.05/releases/21.05_announce_user.html#new-datatypes) ## 💾 Supported Data Formats Viv's data loaders support **OME-NGFF** (Zarr), **OME-TIFF**, and **Indexed OME-TIFF**\*. We recommend converting proprietrary file formats to open standard formats via the `bioformats2raw` + `raw2ometiff` pipeline. Non-pyramidal datasets are also supported provided the individual texture can be uploaded to the GPU (< `4096 x 4096` in pixel size). Please see the [tutorial](./tutorial/README.md) for more information. > \*We describe **Indexed OME-TIFF** in our paper as an optional enhancement to provide > efficient random chunk access for OME-TIFF. Our approach substantially improves chunk > load times for OME-TIFF datasets with large Z, C, or T dimensions that otherwise may > incur long latencies due to seeking. More information on generating an IFD index (JSON) can > be found in our tutorial or [documentation](http://viv.gehlenborglab.org/#data-preparation). ## 💽 Installation ```bash $ npm install @hms-dbmi/viv ``` You will also need to install [deck.gl](https://deck.gl) and other `peerDependencies` manually. This step prevent users from installing multiple versions of deck.gl in their projects. ```bash $ npm install deck.gl @luma.gl/core ``` Breaking changes may happen on the minor version update. Please see the [changelog](https://github.com/hms-dbmi/viv/blob/master/CHANGELOG.md) for information. ## 📖 Documentation Detailed API information and example sippets can be found in our [documentation](http://viv.gehlenborglab.org). ## 🏗️ Development ```bash $ git clone https://github.com/hms-dbmi/viv.git $ cd viv && npm install $ npm start ``` Please install the [Prettier plug-in](https://prettier.io/docs/en/editors.html) for your preferred editor. Badly formatted code will fail in our CI. To run unit and integration tests locally, use `npm test`. Our full production test suite, including linting and formatting, is run via `npm run test:prod`. To our knowledge, Viv can be developed with Node version greater than 10. You can check which current versions are tested in our CI by naviating to our [Github Workflow](https://github.com/hms-dbmi/viv/blob/master/.github/workflows/test.yml#L31). ## 🛠️ Build - `@hms-dbmi/viv` library: `npm run build` - `Avivator` viewer: `npm run build:avivator` ## 📄 Publish First checkout a new branch like `release/version`. Update the `CHANGELOG.md` and bump the version via `npm verion [major | minor | patch]`. Commit locally and push a tag to Github. Next, run `./publish.sh` to release the package on npm and publish Avivator. Finally, make a PR for `release/version` and squash + merge into `master`. ## 🌎 Browser Support Viv supports both [WebGL1](https://caniuse.com/?search=webgl) and [WebGL2](https://caniuse.com/?search=webgl2) contexts, to provides coverage across Safari, Firefox, Chrome, and Edge. Please [file an issue](https://github.com/hms-dbmi/viv/issues/new) if you find a browser in which Viv does not work. --- _Source: https://npm.io/package/ucsc-xena-viv · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._