{
const brush = vl.selectInterval().resolve("global");
const legend = vl.selectPoint().fields("Cylinders").bind("legend");
const brushAndLegend = vl.and(brush, legend);
return vl
.markCircle()
.data(cars)
.params(brush, legend)
.encode(
vl.x().fieldQ(vl.repeat("column")),
vl.y().fieldQ(vl.repeat("row")),
vl.color().if(brushAndLegend, vl.fieldO("Cylinders")).value("grey"),
vl.opacity().if(brushAndLegend, vl.value(0.8)).value(0.1)
)
.width(140)
.height(140)
.repeat({
column: ["Acceleration", "Horsepower", "Miles_per_Gallon"],
row: ["Miles_per_Gallon", "Horsepower", "Acceleration"]
})
.render();
}