Structural variant views

Circular, breakpoint split, spreadsheet and SV inspector views.

On this page: Circular view · Breakpoint split view · Spreadsheet view · SV inspector · Multiple views in one session

Circular view

Structural variants around the genome.

View source — 32 lines

import { JBrowse } from '@jbrowse/react-app2'

const base = 'https://jbrowse.org/code/jb2/main/test_data/volvox'

const assemblies = [{ name: 'volvox', uri: `${base}/volvox.2bit` }]

const tracks = [
  {
    type: 'VariantTrack',
    trackId: 'volvox_sv',
    name: 'volvox structural variants',
    assemblyNames: ['volvox'],
    category: ['Variants'],
    adapter: { type: 'VcfTabixAdapter', uri: `${base}/volvox.dup.vcf.gz` },
  },
]

export default function CircularExample() {
  return (
    <JBrowse
      assemblies={assemblies}
      tracks={tracks}
      views={[
        {
          type: 'CircularView',
          assembly: 'volvox',
          tracks: ['volvox_sv'],
        },
      ]}
    />
  )
}

Breakpoint split view

One structural variant across two regions.

View source — 42 lines

import { JBrowse } from '@jbrowse/react-app2'

const base = 'https://jbrowse.org/code/jb2/main/test_data/volvox'

const assemblies = [{ name: 'volvox', uri: `${base}/volvox.2bit` }]

const tracks = [
  {
    type: 'AlignmentsTrack',
    trackId: 'volvox_sv_cram',
    name: 'volvox-sv (cram)',
    assemblyNames: ['volvox'],
    category: ['Alignments'],
    adapter: { type: 'CramAdapter', uri: `${base}/volvox-sv.cram` },
  },
]

export default function BreakpointSplitExample() {
  return (
    <JBrowse
      assemblies={assemblies}
      tracks={tracks}
      views={[
        {
          type: 'BreakpointSplitView',
          views: [
            {
              loc: 'ctgA:1-5000',
              assembly: 'volvox',
              tracks: ['volvox_sv_cram'],
            },
            {
              loc: 'ctgB:1-5000',
              assembly: 'volvox',
              tracks: ['volvox_sv_cram'],
            },
          ],
        },
      ]}
    />
  )
}

Spreadsheet view

A VCF as a sortable, filterable table.

View source — 21 lines

import { JBrowse } from '@jbrowse/react-app2'

const base = 'https://jbrowse.org/code/jb2/main/test_data/volvox'

const assemblies = [{ name: 'volvox', uri: `${base}/volvox.2bit` }]

export default function SpreadsheetExample() {
  return (
    <JBrowse
      assemblies={assemblies}
      tracks={[]}
      views={[
        {
          type: 'SpreadsheetView',
          assembly: 'volvox',
          uri: `${base}/volvox.filtered.vcf.gz`,
        },
      ]}
    />
  )
}

SV inspector

A spreadsheet paired with a circular view.

View source — 21 lines

import { JBrowse } from '@jbrowse/react-app2'

const base = 'https://jbrowse.org/code/jb2/main/test_data/volvox'

const assemblies = [{ name: 'volvox', uri: `${base}/volvox.2bit` }]

export default function SvInspectorExample() {
  return (
    <JBrowse
      assemblies={assemblies}
      tracks={[]}
      views={[
        {
          type: 'SvInspectorView',
          assembly: 'volvox',
          uri: `${base}/volvox.dup.vcf.gz`,
        },
      ]}
    />
  )
}

Multiple views in one session

A circular overview above a linear detail view.

View source — 46 lines

import { JBrowse } from '@jbrowse/react-app2'

const base = 'https://jbrowse.org/code/jb2/main/test_data/volvox'

const assemblies = [{ name: 'volvox', uri: `${base}/volvox.2bit` }]

const tracks = [
  {
    type: 'VariantTrack',
    trackId: 'volvox_sv',
    name: 'volvox structural variants',
    assemblyNames: ['volvox'],
    category: ['Variants'],
    adapter: { type: 'VcfTabixAdapter', uri: `${base}/volvox.dup.vcf.gz` },
  },
  {
    type: 'AlignmentsTrack',
    trackId: 'volvox_cram',
    name: 'volvox-sorted.cram',
    assemblyNames: ['volvox'],
    category: ['Alignments'],
    adapter: { type: 'CramAdapter', uri: `${base}/volvox-sorted.cram` },
  },
]

export default function MultiViewSession() {
  return (
    <JBrowse
      assemblies={assemblies}
      tracks={tracks}
      views={[
        {
          type: 'CircularView',
          assembly: 'volvox',
          tracks: ['volvox_sv'],
        },
        {
          type: 'LinearGenomeView',
          assembly: 'volvox',
          loc: 'ctgA:1..50000',
          tracks: ['volvox_cram'],
        },
      ]}
    />
  )
}