npm

Need private packages and team management tools?Check out npm Orgs. »

@haukeland-mgm/plateviewer

1.0.2 • Public • Published

Description

This is a vue.js component for visualizing a (96 well) plate as found in many wet labs.

It uses the bulma framework for CSSing and layout, font awesome as a font to provide icons, and buefy for tooltips.

Usage / Development

Consider the app in the example directory app, and to get it up and running, run

npm install
npm run dev

This will install all dependencies for the example app, and run the app with hot-reload and whatnot for your viewing and development convenience.

Inputs (Props)

  • numberOfRows (default: 8, type: int)
  • numberOfColumns (default: 12, type: int)
  • plateMapping: Object containing info, used for mapping and determining which wells are full, and displaying extra info as tooltips; e.g. ``` { "id": "43210000", "placements": [ { "position": "A1", "sample": { "id": "6572411215" } }, { "position": "B1", "sample": { "id": "6573166189" } }, { "position": "C1", "sample": { "id": "6562071415" } }, { "position": "D1", "sample": { "id": "6562369215" } }, { "position": "E1", "sample": { "id": "6568433989" } }, { "position": "F1", "sample": { "id": "6571775089" } }, { "position": "G1", "sample": { "id": "6571773523" } }, { "position": "H1", "sample": { "id": "6571977289" } } ] }

**TODO** Specify what data can be passed, and how it will be displayed.

install

npm i @haukeland-mgm/plateviewer

Downloadsweekly downloads

7

version

1.0.2

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability