JBrowse 2 · React App examples

Circular view

Show structural variants in a circular view.

CircularView renders structural variants as arcs around a circular ideogram. init takes a single assembly and the tracks to show:

{
  type: 'CircularView',
  init: {
    assembly: 'volvox',
    tracks: ['volvox_sv_test'],
  },
}

Like every view type, this is declared as a defaultSession.views entry (see Linear synteny view for the general pattern). The fields init accepts come from the CircularView model docs.

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

import { volvoxConfig } from '../volvoxConfig.ts'

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