IGV.jsの操作

https://github.com/igvteam/igv.js/wiki/API
ココを参照する。

Trackを読み込むには

igv.browser.loadTrack({
  url: 'http://data.broadinstitute.org/igvdata/1KG/b37/data/HG02450/alignment/HG02450.mapped.ILLUMINA.bwa.ACB.low_coverage.20120522.bam',
  label: 'HG02450'
}

このような書式であることは色々ソースを見ていてなんとなくわかっていた。
上の例ではbamを公開サイトから読み込んでいる。
https://github.com/igvteam/igv.js/wiki/Tracks
ココの情報を合わせて読むと、bamファイルを読み込む書式は

{
    name: 'Track name', #この部分がtrackの名前として画面左の方に表示される。必須
   type: 'alignment', #bamファイルのタイプはalignment、未指定で問題ない
    url: '../static/exome/bam/hogehoge.bam', #データの所在、ファイルでもwebアドレスでもいいが必須
    indexURL: '../static/exome/bam/hogehoge.bam.bai', #インデックスファイルの所在、未指定でも可
    height: '300' #trackの大きさ。デフォルトは50
# autoHeight: 'true' #自動で設定する場合。minHeight, maxHeightでlimitを指定
}

まあこれくらい。他に色とかペアとか指定できるけど、あとからメニューで変えればいいのでまずはシンプルに。
また、vcfファイルのときは

{
    name: 'vcf track',
    type: 'variant',
    url: '../static/exome/bam/hogehoge.bam',
    autoHeight: 'true'
}

あとはデフォルトで多分いい。

ゲノムポジションの指定は

igv.browser.search('chr10:1000-2000')

という感じで指定することになっているので
検索結果のポジションから

<a href="#"
onclick="igv.browser.search('chr{{ samp.pos }}')>{{ samp.pos }}</a>

とリンクを張れば良さそうだ。