Skip to main content

ChordSyntenyDisplay

Auto-generated from the @jbrowse/mobx-state-tree model in the source — see the developer guide for concepts. Provided by the circular-view plugin. View source.

Example usage

The circular-view display for a SyntenyTrack: each alignment is drawn as a ribbon between its span on one side and its mate's span on the other, so an inversion reads as a twist. The track config below is what creates it; its colors are the config slots on ChordSyntenyDisplay:

{
  type: 'SyntenyTrack',
  trackId: 'volvox_self',
  name: 'Volvox self-alignment',
  assemblyNames: ['volvox', 'volvox'],
  adapter: {
    type: 'PAFAdapter',
    uri: 'https://example.com/volvox_self.paf',
    queryAssembly: 'volvox',
    targetAssembly: 'volvox',
  },
  displays: [
    {
      type: 'ChordSyntenyDisplay',
      displayId: 'volvox_self-ChordSyntenyDisplay',
    },
  ],
}

A track aligning two assemblies needs both of them on the circle, which is the view's assembly: ['hg38', 'mm39'] — see the synteny track guide.

Draws a SyntenyTrack in a CircularView, with a ribbon joining the two spans of each alignment.

The configuration slots for this model are documented on its config schema page.

Each section ends with the members a composed model contributes, linked to the page that documents them.

Properties

MemberDescription
type
type: types.literal('ChordSyntenyDisplay')
configuration
configuration: ConfigurationReference(configSchema)
1 inherited property from one model

From BaseDisplay: id

Volatiles

5 inherited volatiles from 2 models

From BaseChordDisplay: features, reloadCounter

From BaseDisplay: error, statusMessage, statusProgress

Getters

MemberDescription
ready
boolean		loaded, and no reorder this launch asked for still owed. Ribbons drawn before it would be drawn against the arcs it is about to move; a reorder that failed keeps this false and shows as displayPhase error, so a capture never commits the hairball
displayError
unknown		the fetch's error, or else the owed reorder's
featureNoun
string
attributeRanges
Record<string, AttributeRange>		the span or label list each color channel covers over the held alignments, which the view's ramps and key scale to
channelNames
string[]		the color channels the view's modes can paint: the preset measurements and the columns the adapter declares
ribbonColors
Map<string, number>		each alignment's packed color under the view's color, by feature id. A chromosome mode paints the ideogram color of the chromosome it joins, so a ribbon matches the arc it leaves; a label the view hides paints at zero alpha
ribbonFill
(feature: Feature) => string		the resting fill of each ribbon, opaque: the ribbons share one ribbonOpacity, so an opacity drag repaints no ribbon
ribbonOpacity
number		the fill opacity every resting ribbon draws at, the view's opacityLevel; a ribbon's own color alpha (a color.value's, an opacity field's fade) rides its lane
drawnFeatures
Feature[] | undefined		what the ribbons draw: the held alignments at least the view's minAlignmentLength long on their own side, less those the view's color hides
shapeAlpha
number		ribbonOpacity, as the canvas reads it
ribbonFeet
{ x1: Float32Array<ArrayBuffer>; x2: Float32Array<ArrayBuffer>; y1: Float32Array<ArrayBuffer>; y2: Float32Array<ArrayBuffer>; xGaps: Uint32Array<ArrayBuffer>; yGaps: Uint32Array<ArrayBuffer>; strand: Float32Array<ArrayBuffer>; placed: Uint8Array<ArrayBuffer>; index: Map<Feature, number>; }
every held alignment's feet on the circle's unrolled axis, by the feature's place in features: rebuilt by a fetch or a change to the regions, never by a recolor, a zoom or a rotation
ribbonLanes
RibbonLanes		the drawn alignments as the ribbon mark's lanes, each in its color at that color's own alpha
paintedAssemblyName
string | undefined		the genome whose ideogram this track paints: the second of the two it joins on the circle, none for a genome aligned to itself
ideogramPaint
ReadonlyMap<string, PaintRun[]>		the painted genome's ideogram, by slice key: each stretch in the color of the first genome's chromosome that the drawn ribbons over it mostly come from, one bin per CSS px
drawnCount
number		how many alignments the canvas draws as ribbons
cappedMeanSpanPx
number		the drawn alignments' mean span on screen, each counted at no more than the width the thin fade stops caring about, which the view's 'auto' fade is decided on
laneIndexById
Map<string, number>		each drawn feature's place in the lanes, by id
shapes
RibbonShape[]		every drawn alignment as the export draws it
legendColor
string | undefined		the ribbon fill the circle's key shows: the one color every ribbon paints when the view's mode keys nothing of its own
featureWidgetType
{ type: string; id: string; }		the panel the linear synteny displays open for the same record, so a ribbon clicked on the circle and a ribbon clicked in a synteny view share one drawer entry
chordCell
ChordCell | undefined		what the view's canvas draws for this display: its lanes while it is ready, nothing while its loading or error ring covers the circle
25 inherited getters from 2 models

From BaseChordDisplay: view, trackAssemblyNames, fetchInert, loaded, svgReady, displayPhase, radiusPx, bezierRadiusRatio, bezierRadius, sliceIndex, selectedFeatureId, hoveredFeatureId, chordStage, figureStage

From BaseDisplay: parentTrack, RenderingComponent, DisplayBlurb, adapterConfig, isMinimized, hoveredFeature, plotKeys, plot, schemaNotices, plotExamples, configDocsUrl

Methods

MemberDescription
firstGenomeEnds
(feature: Feature) => readonly [string, string]		an alignment's two refNames with the circle's first genome's end first, the order the view's query and target modes read them in
shapeAt
(i: number) => RibbonShape		lane i as the SVG side draws it, on the unrotated figure
shapeFor
(featureId: string) => RibbonShape | undefined		the ribbon a drawn alignment's id names, as the SVG side draws it; undefined for an id the canvas draws no ribbon for
shapeLabel
(feature: Feature) => string
shapePathFor
(feature: Feature) => string | undefined		a drawn feature's outline as an SVG path on the unrotated figure, for anything that has to find a ribbon on screen without a DOM node to find
alignmentsBetween
(referenceAssembly: string, currentAssembly: string) => AlignmentData[]
the held alignments joining two assemblies on the circle, in canonical refNames and oriented reference side first, which is what the view's reorder reads instead of fetching the file again
partnerSpans
(index: number) => PartnerSpan[]		each drawn alignment's stretch on slice index, named by the chromosome at its other end, with that chromosome's genome where the track joins two
hitAt
(dx: number, dy: number) => Feature | undefined		the alignment whose ribbon covers a point CSS px from the circle's centre in the screen frame, the topmost where several do
renderSvg
(_opts: ViewExportSvgOptions & { theme?: ThemeOptions | undefined; }) => Promise<Element | null>
9 inherited methods from 2 models

From BaseChordDisplay: assemblyOf, canonicalRefName, sliceFor, axisSlice

From BaseDisplay: renderingProps, trackMenuItems, liftPlot, plotProblems, plotWrites

Actions

MemberDescription
clickFeature
(feature: Feature) => void		what a click on the canvas reaches: the alignment's details
reload
() => void		refetch, and run a reorder this launch still owes, which is how the error ring's Retry reaches a reorder that failed
7 inherited actions from 2 models

From BaseChordDisplay: openErrorDialog, setFeatures

From BaseDisplay: setStatusMessage, setError, clearHoveredFeature, applyDisplaySettings, applyPlot