How do you visualize a 3 million x 3 million matrix and allow users to explore features across a wide range of different scales? We built HiGlass and HiPiler, web-based visualization tools for analysis of Hi-C and other genome-wide chromosome interaction data that enables comparison of multiple contact matrices and integration of other data types. In my talk, I will discuss several use cases and describe how we architected HiGlass and HiPiler.

1. Multi-Scale
Visualization Tools for
Exploration of
Chromosome Interaction Data
Nils Gehlenborg, PhD
http://gehlenborglab.org
HARVARD MEDICAL SCHOOL
DEPARTMENT OF BIOMEDICAL INFORMATICS
@nils_gehlenborg

2. Acknowledgements
Peter Kerpedjiev, PhD Fritz Lekschas, MSc
HARVARD MEDICAL SCHOOL HARVARD SCHOOL OF ENGINEERING &
APPLIED SCIENCES
Funding provided by
NIH COMMON FUND (U01 CA200059)
NIH NATIONAL HUMAN GENOME RESEARCH INSTITUTE (R00 HG007583)

3. Acknowledgements
Peter Kerpedjiev
Fritz Lekschas
Nezar Abdennur
Benjamin Bach
Chuck McCallum
Kasper Dinkla
Hendrik Strobelt
Jacob M Luber
Scott B Ouellette
Alaleh Ahzir
Nikhil Kumar
Jeewon Hwang
Burak H Alver
Hanspeter Pfister
Leonid A Mirny
Peter J Park

4. Open Research
Demo Site: http://higlass.io
Code: https://github.com/hms-dbmi/higlass
Docker: https://hub.docker.com/r/gehlenborglab/higlass/
Preprint: http://biorxiv.org/content/early/2017/03/31/121889
HIGLASS
HIPILER
Demo Site: https://flekschas.github.io/hipiler/ (beta)
Code: https://github.com/flekschas/hipiler
Preprint: http://biorxiv.org/content/early/2017/04/03/123588

5. DNA in the Nucleus

6. https://upload.wikimedia.org/wikipedia/commons/7/7a/Basketball.png

7. https://upload.wikimedia.org/wikipedia/commons/7/7a/Basketball.png
http://simplemaps.com/resources/svg-us

8. Chromosome Interaction Data

9. Rao et al., Cell, 2014

10. Contact Matrix
3 Million x 3 Million Cells
1 KB resolution

11. Visualization Techniques

12. Yardımcı & Noble, Genome Biology, 2017
Global Interactions
Juicebox
HEATMAP

13. Yardımcı & Noble, Genome Biology, 2017
Global Interactions
Juicebox
HEATMAP

14. Yardımcı & Noble, Genome Biology, 2017
Global Interactions
Washington University
Epigenome Browser
ARC DIAGRAM

15. Yardımcı & Noble, Genome Biology, 2017
Local Interactions
3D Genome Browser
HEATSTRIP

16. Yardımcı & Noble, Genome Biology, 2017
Local Interactions
Washington University
Epigenome Browser
ARC DIAGRAM

17. Tasks

18. 1. View interactions at different scales
From genome to individual bins
2. Compare interactions across many conditions
Two or more conditions
3. View and compare features
Within and across maps
4. Do all of this in a web browser
Interaction and low latency

19. Technology

20. Cooler
File
HDF5Pixi.js + D3.js + React
HiGlass
Server
HiGlass
Client
Django + Redis
EBSChrome / Safari / Firefox EC2
https://github.com/mirnylab/cooler

21. Aggregation: sum adjacent cells to create lower
resolution views
Tiling: partition matrices into 256x256 blocks that can
be individually displayed

23. Dealing with Large Maps: HiGlass

24. 1. View interactions at different scales
From genome to individual bins
2. Compare interactions across many conditions
Two or more conditions
3. Do all of this in a web browser
Interaction and low latency

25. Demo Time: http://higlass.io
Examples: http://higlass.io/examples/

26. Dealing with Many Features: HiPiler

27. 1. View and compare features
Within and across maps
2. Do all of this in a web browser
Interaction and low latency

28. Video: http://biorxiv.org/highwire/filestream/36210/field_highwire_adjunct_files/0/123588-1.mov

29. Take Aways

30. 1. Good visualization comes at a cost: aggregation
2. Fast rendering is crucial: use advanced technologies
3. A flexible framework provides new opportunities

31. My lab is hiring postdocs!
HARVARD MEDICAL SCHOOL
DEPARTMENT OF BIOMEDICAL INFORMATICS
http://gehlenborglab.org
Data visualization, analysis, and management for:
• exploration tools for data repositories
• provenance graphs
• genomic structural variants
• dynamics of the 3D genome
• cancer subtypes in patient cohorts