Rect

// Single View Specification{  "data": ... ,  "mark": "rect",  "encoding": ... ,  ...}

Therect mark represents an arbitrary rectangle.

Documentation Overview

• Rect Mark Properties
• Examples
  • Heatmap
  • Ranged Rectangles
• Rect Config

Rect Mark Properties

// Single View Specification{  ...  "mark": {    "type": "rect",    ...  },  "encoding": ... ,  ...}

A rect mark definition can contain anystandard mark properties and the following special properties:

Examples

Heatmap

Using therect marks with discrete fields onx andy channels creates a heatmap.

We can similarly use rect with binned fields and discretized temporal fields.

Ranged Rectangles

Specifying bothx andx2 and/ory andy2 creates a rectangle that spans over certain x and/or y values.

For example, we can userect to create an annotationlayer that provides a shading between globalmin andmax values.

Rect Config

// Top-level View Specification{  ...  "config": {    "rect": ...,    ...  }}

Therect property of the top-levelconfig object sets the default properties for all rect marks. Ifmark property encoding channels are specified for marks, these config values will be overridden.

Besides standardrect mark properties (excepttype,style, andclip), rect config can contain the following additional properties: