vega-lite api selectInterval() not working

Community Help
1

I have a small scatterplot that i want to brush in *x* and y*,* but it currently only selects along the *y* axis. I cannot see what the problem is. Using vl API v5.
Code:

{
  const selectBrush = vl.selectInterval();

  return vl
    .markCircle({ stroke: "black", strokeWidth: 1 })
    .width(400)
    .params(selectBrush)
    .title({
      text: "NonViolent Crime Totals by Neighbourhoods Summer 2016",
      subtitle: headerString
    })
    // .title(headerString)
    .data(crimeDensityTotal)

    .encode(
      vl
        .size()
        .fieldQ("population")
        .legend({ orient: "right" })
        .scale({ domain: [0, 50000] }),
      vl
        .y()
        .fieldQ("sqm")
        .title("Square M per person")
        .scale({ domain: [0, 500] }),
      vl
        .x()
        .fieldQ("Offense")
        .aggregate("count")
        .scale({ type: "log" })
        .title("Total Crimes"),
      vl
        .color()
        .scale({ range: OffenseCatColors })
        .legend({ orient: "right" })
        .if( selectBrush, vl.fieldN("Offense Category")).value("lightgrey")
    ).render();
}
2

Can you share your example as a notebook?

3

There is a lot in this notebook but the simpler example is at the end as the single (nonfaceted) scatter plot.
https://observablehq.com/d/d99dc850cb235a15
Note that neither brush works, not even the solution copied from Jeff Heer’s example.

4

Your notebook seems to be private?

5

Public now

image001.png

6

It seems that you can’t use a selection on an aggregated channel, at least not in multiple views (see docs):

vl.selectInterval().encodings(["x", "y"])

WARN Cannot project a selection on encoding channel “y” as it uses an aggregate function (“count”).

7

Thank you! That seems very limiting.