ideogram
Version:
Chromosome visualization with D3.js
73 lines (60 loc) • 1.91 kB
HTML
<html>
<head>
<title>Homology, interspecies | Ideogram</title>
<link type="text/css" rel="stylesheet" href="../src/css/ideogram.css"/>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.1.1/d3.min.js"></script>
<script type="text/javascript" src="../src/js/ideogram.js"></script>
</head>
<body>
<h1>Homology, interspecies | Ideogram</h1>
<a href=".">Back to overview</a>
<p>
The location of the <a href="http://www.ncbi.nlm.nih.gov/gene/2475">MTOR</a>
gene in human and mouse is depicted below. MTOR is clinically associated
with cancer and Alzheimer's disease.
</p>
<script type="text/javascript">
function onIdeogramLoad() {
// See HomoloGene entry for MTOR at
// http://www.ncbi.nlm.nih.gov/homologene/3637
// Placements for H. sapiens and M. musculus used below.
// Placements from latest annotation release in
// Human: http://www.ncbi.nlm.nih.gov/gene/2475#genomic-context
// Mouse: http://www.ncbi.nlm.nih.gov/gene/56717#genomic-context
var chrs = ideogram.chromosomes,
chr1 = chrs["9606"]["1"],
chr4 = chrs["10090"]["4"],
syntenicRegions = [];
range1 = {
chr: chr1,
start: 11106531,
stop: 11262557,
orientation: "reverse"
};
range2 = {
chr: chr4,
start: 148448582,
stop: 148557685
};
syntenicRegions.push({"r1": range1, "r2": range2});
ideogram.drawSynteny(syntenicRegions);
}
var config = {
organism: ["human", "mouse"],
chromosomes: {
"human": ["1"],
"mouse": ["4"]
},
chrHeight: 400,
chrMargin: 50,
fullChromosomeLabels: true,
showBandLabels: true,
perspective: "comparative",
rotatable: false,
onLoad: onIdeogramLoad
};
var ideogram = new Ideogram(config);
</script>
</body>
</html>