marks Property
Marks visually encode data using geometric primitives.
General JSON format:
"marks": [
{
"type": points | line | polys | symbol,
"from": { data: <dataSourceID> },
"properties": { <propName>: <propVal> }, ... { <propName>: <propVal> }
"transform": { <transformType>: <transformName> }
},
{
...
}
],
A Vega
marks
specification includes the following properties:Property | Data Type | Required | Description |
string | X | Graphical marks type or shape:
| |
object | ​ | Database table associated with the marks. | |
object | X | Visual encoding rules. Valid properties depend on marks type . | |
object | ​ | Transforms applied to a mark. |
Marks are rendered in marks property array order.
Marks property values can be constants or as data references. You can use the scales property to transform marks property values to the visualization area.
Apply the
x
and y
scales to the x
and y
database table columns to scale the data to the visualization area width and height. For example:const exampleVega = {
"width:" 384,
"height:" 564,
"data:" [ ... elided ... ],
"scales:" [
{
"name:" "x",
"type:" "linear",
"domain:" [-3650484.1235206556,7413325.514451755],
"range:" "width"
},
{
"name:" "y",
"type:" "linear",
"domain:" [-5778161.9183506705, 10471808.487466192],
"range:" "height"
}
],
"marks:" [
{
"type:" "points",
"from:" { "data:" "tweets" },
"properties:" {
"x:" { "scale:" "x", "field:" "x" },
"y:" { "scale:" "y","field:" "y"}
}
}
]
};
Marks must include a
type
property that specifies the geometric primitive to use to render the data.Marks Type | Description |