Layering text over heatmap
View this example in the online editor
Vega-Lite JSON Specification
{
"$schema": "https://vega.github.io/schema/vega-lite/v2.json",
"data": {"url": "data/cars.json"},
"encoding": {
"y": {"field": "Origin", "type": "ordinal"},
"x": {"field": "Cylinders", "type": "ordinal"}
},
"layer": [{
"mark": "rect",
"encoding": {
"color": {"aggregate": "count", "field": "*", "type": "quantitative"}
}
}, {
"mark": "text",
"encoding": {
"text": {"aggregate": "count", "field": "*", "type": "quantitative"},
"color": {
"condition": {"test": "datum['count_*'] > 100", "value": "black"},
"value": "white"
}
}
}],
"config": {
"scale": {"bandPaddingInner": 0, "bandPaddingOuter": 0},
"text": {"baseline": "middle"}
}
}