Skip to content

Rule

Rule mark displays each row as a line segment. Rules can span the whole width or height of the view. Alternatively, they may have specific endpoints.

{
  "description": "Rule mark example.",

  "data": {
    "sequence": { "start": 0, "stop": 15, "as": "y" }
  },

  "mark": { "type": "rule", "strokeDash": [6, 3] },

  "encoding": {
    "x": { "field": "y", "type": "quantitative" },
    "color": { "field": "y", "type": "nominal", "legend": null }
  }
}

Channels

Rule mark supports the primary and secondary position channels and the color, opacity, and size channels.

Properties

buildIndex
Type: boolean

Whether the x channel should build an index for efficient subset rendering. If omitted, GenomeSpy enables indexing automatically for positional x encodings.

clip
Type: boolean | "x" | "y" | "never"

Controls whether the mark is clipped to the UnitView's rectangle. The values "x" and "y" clip only in the corresponding screen-space direction. Inherited clipping from parent containers still applies unless "never" is used.

Default value: true when either positional scale is zoomable; otherwise false

color
Type: string | ExprRef

Color of the mark. Affects either fill or stroke, depending on the filled property.

cullByVisibleRange
Type: boolean | "x" | "y"

Hide point-like mark instances whose anchor falls outside the inherited visible range in the given screen-space direction.

cursor
Type: string | ExprRef

Mouse cursor shown while the pointer is over the mark. Mark cursor takes precedence over enclosing view cursors.

Default value: browser default

minLength
Type: number | ExprRef

The minimum stroke length in pixels. Use this property to ensure that very short strokes remain visible even when the user zooms out.

Default value: 0

opacity
Type: number | ExprRef

Opacity of the mark. Affects fillOpacity or strokeOpacity, depending on the filled property.

size
Type: number | ExprRef

Stroke width of "link" and "rule" marks in pixels, the area of the bounding square of "point" mark, or the font size of "text" mark.

strokeCap
Type: "butt" | "square" | "round" | ExprRef

The style of stroke ends. Available choices: "butt", "round", and "square".

Default value: "butt"

strokeDash
Type: array

An array of of alternating stroke and gap lengths or null for solid strokes.

Default value: null

strokeDashOffset
Type: number

An offset for the stroke dash pattern.

Default value: 0

style
Type: string | string[]

Named style reference(s) resolved from config.style. If an array is provided, later styles override earlier ones.

tooltip
Type: HandledTooltip | null | boolean

Tooltip handler. If false, no tooltip is shown but the mark remains available for renderer picking and mark interactions. If null, no tooltip is shown and the mark is excluded from picking unless its view declares a point selection; a point selection overrides this picking opt-out. If string, specifies the tooltip handler to use.

x
Type: number | ExprRef

Position on the x axis.

x2
Type: number | ExprRef

The secondary position on the x axis.

x2Offset
Type: number | ExprRef

Offset of the x2 coordinate in logical pixels. When x2 is implicit, it inherits xOffset unless this property is specified.

Default value: inherited from xOffset for an implicit x2, otherwise 0

xOffset
Type: number | ExprRef

Offset of the x coordinate in logical pixels.

Default value: 0

y
Type: number | ExprRef

Position on the y axis.

y2
Type: number | ExprRef

The secondary position on the y axis.

y2Offset
Type: number | ExprRef

Offset of the y2 coordinate in logical pixels. When y2 is implicit, it inherits yOffset unless this property is specified.

Default value: inherited from yOffset for an implicit y2, otherwise 0

yOffset
Type: number | ExprRef

Offset of the y coordinate in logical pixels.

Default value: 0

Examples

Ranged rules

{
  "description": "Ranged rule mark example.",

  "data": {
    "values": [
      { "y": "A", "x": 2, "x2": 7 },
      { "y": "B", "x": 0, "x2": 3 },
      { "y": "B", "x": 5, "x2": 6 },
      { "y": "C", "x": 4, "x2": 8 },
      { "y": "D", "x": 1, "x2": 5 }
    ]
  },

  "mark": { "type": "rule", "size": 10, "strokeCap": "round" },

  "encoding": {
    "y": { "field": "y", "type": "nominal" },
    "x": { "field": "x", "type": "quantitative" },
    "x2": { "field": "x2" }
  }
}

Human-mouse synteny

{
  "description": [
    "Human-mouse synteny example",
    "Data source: http://bioinfo.konkuk.ac.kr/synteny_portal/"
  ],

  "title": "Human-mouse synteny",

  "view": { "stroke": "lightgray" },

  "data": { "url": "data/synteny-hg38-mm10.tsv" },

  "mark": {
    "type": "rule",
    "strokeCap": "round",
    "size": 2
  },

  "encoding": {
    "x": {
      "chrom": "hg38_chrom",
      "pos": "hg38_start",
      "type": "locus",
      "scale": { "type": "locus", "assembly": "hg38" },
      "axis": { "chromGrid": true, "chromGridColor": "#bbb" },
      "title": "hg38"
    },
    "x2": { "chrom": "hg38_chrom", "pos": "hg38_end" },
    "y": {
      "chrom": "mm10_chrom",
      "pos": "mm10_start",
      "type": "locus",
      "scale": { "type": "locus", "assembly": "mm10" },
      "axis": { "chromGrid": true, "chromGridColor": "#bbb" },
      "title": "mm10"
    },
    "y2": { "chrom": "mm10_chrom", "pos": "mm10_end" },
    "color": { "field": "mm10_chrom", "type": "nominal", "legend": null }
  }
}