Overview | Ideogram

Ideogram.js is a JavaScript library for chromosome visualization. Ideogram supports drawing and animating genome-wide datasets.

In the examples below, raw cytogenetic band data is read in and rendered entirely on the client using D3.js.

  1. Human. Chromosomes 1-22, X and Y rendered vertically.
  2. Mouse. Chromosomes 1-19, X and Y rendered horizontally.
  3. Eukaryotes. Genomes for many organisms, using data fetched via API.
  4. Homology, basic. Simple relations between two chromosomes.
  5. Homology, advanced. Relations between two chromosomes, using color and opacity.
  6. Homology, interspecies. Relations between two chromosomes, each from a different taxon.
  7. Annotations, basic. Location of a gene on a chromosome.
  8. Annotations, overlaid. Overlaid features on chromosomes.
  9. Annotations, colored arms. Cytogenetic arms filled with different colors.
  10. Annotations, tracks. Stacked features on chromosomes.
  11. Annotations, external data. Annotation data fetched from a third party API.
  12. Annotations, histogram. Dense feature distributions on chromosomes.
  13. Layout, small. Chromosomes surrounded by other content.
  14. Brush. Move and resize a slider-like widget to change genomic coordinates in focus.

Ideogram is developed by Eric Weitz.