# jbrowse-plugin-ideogram

> JBrowse 2 ideogram plugin

Latest version **2.0.0** (published 2026-08-09) · MIT license · 0 weekly downloads

## Install

```sh
npm install jbrowse-plugin-ideogram
pnpm add jbrowse-plugin-ideogram
yarn add jbrowse-plugin-ideogram
bun add jbrowse-plugin-ideogram
```

## Health

**Score 70/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 2.0.0 |
| Published | 2026-08-09 |
| First published | 2021-04-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 2.2 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 2 |
| Maintainers | cmdcolin, carolinebridge |
| Keywords | jbrowse, jbrowse2 |

## Links

- npm: https://www.npmjs.com/package/jbrowse-plugin-ideogram
- Repository: https://github.com/GMOD/jbrowse-plugin-ideogram
- Homepage: https://github.com/GMOD/jbrowse-plugin-ideogram#readme
- Issues: https://github.com/GMOD/jbrowse-plugin-ideogram/issues
- npm.io page: https://npm.io/package/jbrowse-plugin-ideogram

## Dependencies (3)

- [uuid](https://npm.io/package/uuid.md) ^13.0.0
- [ideogram](https://npm.io/package/ideogram.md) ^1.29.0
- [react-spinners](https://npm.io/package/react-spinners.md) ^0.17.0

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 2.0.0 (latest) — 2026-08-09
- 1.2.3 — 2022-05-13
- 1.2.2 — 2022-02-22
- 1.2.1 — 2022-02-08
- 1.2.0 — 2022-02-03
- 1.1.0 — 2022-01-11
- 1.0.0 — 2021-04-05

## README

# `jbrowse-plugin-ideogram`

> Jbrowse 2 plugin for displaying an ideogram

## Screenshot

![](./img/1.png)

### Note

Uses the great https://eweitz.github.io/ideogram/ library for rendering

## Usage

### In [JBrowse Web](https://jbrowse.org/jb2/docs/quickstart_web)

#### Development

```
git clone https://github.com/cmdcolin/jbrowse-plugin-ideogram
cd jbrowse-plugin-ideogram
yarn
yarn start
```

Then open JBrowse Web to (assuming it is running on port 3000):

http://localhost:3000/?config=http://localhost:9080/config.json

#### Production

Add to the "plugins" of your JBrowse Web config:

```json
{
  "plugins": [
    {
      "name": "Ideogram",
      "url": "https://unpkg.com/jbrowse-plugin-ideogram/dist/jbrowse-plugin-ideogram.umd.production.min.js"
    }
  ]
}
```

## Annotations

To annotate features on the ideogram as in the screenshot above, data must be uploaded via the setup screen's open file interface.

- annotations must be uploaded as a TSV with column headers
- enforced location data must be under a heading called 'genome location' and be in the format of 'chromosomeNumber:start-end', e.g. '1:39895426-39902013'
- alternatively, annotation files provided without genome location data will attempt to be cross referenced with a remote file of gene locations
- each row of data must include `name`
- any external links that wish to be formatted on the widget properly must be in the following format:
  - under a header 'external links'
  - a json string appearing as `"[{"name": "MYLINK", "link": "https://my-link.com/"}]"`
  - each annotation that you wish to have external links to must have this json string
  - multiple external links are permitted
- annotations can be categorized into two categories if the 'tier' header is within the TSV
  - tier 1 is annotated in blue
  - tier 2 is annotated in red
  - this field is to be provided as a 1 or a 2

### examples

#### TSV with only required headers

```tsv
name
note1
note2
```

#### TSV with optional headers

```tsv
name  genomeLocation  tier externalLinks
note1 1:39895426-39902013 1 [{"name":"MYLINK","link":"https://my-link.com/note1"}]
note2 1:157573749-157598080 2 [{"name":"MYLINK", "link":"https://my-link.com/note2"}]
```

Any additional data will be parsed out and displayed in the widget that can be brought out by clicking an annotation on the ideogram.

If these formatting rules are not obeyed the annotations will not be displayed.

---
_Source: https://npm.io/package/jbrowse-plugin-ideogram · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._