Designing genome visualizations with IdeogramJS

Slide 1

Slide 1 text

Eric Weitz Broad Institute of MIT and Harvard 2020-04-24 https://github.com/eweitz/ideogram Designing genome visualizations with Ideogram.js

Slide 2

Slide 2 text

Outline

Slide 3

Slide 3 text

What is an ideogram?

Slide 4

Slide 4 text

Human genome as karyotype

Slide 5

Slide 5 text

Human genome as ideogram

Slide 6

Slide 6 text

Parts of a chromosome

Slide 7

Slide 7 text

p arm q arm Parts of a chromosome

Slide 8

Slide 8 text

Parts of a chromosome

Slide 9

Slide 9 text

Ideograms are widely used

Slide 10

Slide 10 text

Outline

Slide 11

Slide 11 text

Ideogram.js ● ● ● ●

Slide 12

Slide 12 text

Ideogram.js is a reusable component ● ● ● ● ● ●

Slide 13

Slide 13 text

Ideogram.js in React

Slide 14

Slide 14 text

Ideogram.js in Jupyter Notebooks

Slide 15

Slide 15 text

Outline

Slide 16

Slide 16 text

Show the human genome https://eweitz.github.io/ideogram/human

Slide 17

Slide 17 text

https://eweitz.github.io/ideogram/mouse View genome on phone or tablet

Slide 18

Slide 18 text

See any of 100+ eukaryotic genomes https://eweitz.github.io/ideogram/eukaryotes

Slide 19

Slide 19 text

Where do these genes from species A exist in species B?

Slide 20

Slide 20 text

Customize layout

Slide 21

Slide 21 text

Visualize genome alignments

Slide 22

Slide 22 text

Explore differential expression across the genome

Slide 23

Slide 23 text

Use Terra to learn how to run Ideogram data pipeline https://app.terra.bio/#workspaces/degenome/degenome/notebooks/launch/degenome-tutorial.ipynb

Slide 24

Slide 24 text

Compare chromosomal events across cancer samples

Slide 25

Slide 25 text

Inform clinicians and patients about genetics ACMG 59 genes. Red: BRCA1. Purple: highly-weighted genes from NCBI Gene.

Slide 26

Slide 26 text

Load BED ﬁles

Slide 27

Slide 27 text

Show gene location

Slide 28

Slide 28 text

More use cases, live examples, source code: https://eweitz.github.io/ideogram

Slide 29

Slide 29 text

Outline

Slide 30

Slide 30 text

Geometry and orientation

Slide 31

Slide 31 text

Multiple rows for space-efﬁcient layout

Slide 32

Slide 32 text

Annotations: tracks, layout, color, shape

Slide 33

Slide 33 text

Labels and legends

Slide 34

Slide 34 text

Thank you! ● ● ● ●