Using a reactive javascript sql result in a mosaic plot within Observable Framework

[oscaro00]

Within the starter Framework app with the launches dataset, I am trying to create a reactive plot based on user's filter selection. The following logic works to filter and display the table.

const test_query = sql([`
SELECT * FROM launches
  WHERE state IN ('--'${", ?".repeat(selectCountryTest.length)})
`], ...selectCountryTest);

Inputs.table(test_query)

However, the following code throws an error:

vg.plot(
  vg.barX(
    vg.from(test_query),
    {x: vg.count(), y: "family", fill: "#ccc", fillOpacity: 0.2}
  ),
  vg.barX(
    vg.from(test_query, {filterBy: $click}),
    {x: vg.count(), y: "family", fill: "#ccc"}
  ),
  vg.toggleY({as: $click}),
  vg.highlight({by: $click}),
  vg.xDomain(vg.Fixed),
  vg.yDomain($domain),
  vg.yLabel(null),
  vg.colorDomain($domain),
  vg.colorRange($colors),
  vg.marginLeft(45),
  vg.width(660)
)

If I replace, test_query with "launches" in the above code block, then the plot renders, but doesn't react to a user's selection.

The browser debugger reports the following error: "Uncaught (in promise) RuntimeError: index out of bounds"

Is test_query not the right type for the Mosaic plot function?

[domoritz]

from expected the table name. You can register the dataset with the coordinator.

[oscaro00]

I appreciate the help. From reading the DuckDB documentation on the Observable Framework website, there is an example of registering a table with the code

const db = DuckDBClient.of({gaia: FileAttachment("gaia-sample.parquet")});

The documentation says DuckDBClient.of() works with arrow tables, but I'm having trouble with the syntax. Both

const db = DuckDBClient.of({interactive_tbl: Arrow.tableFromIPC(test_query)});

and

const db = DuckDBClient.of({interactive_tbl: test_query});

are throwing errors. Am I missing something obvious?

[Fil]

duplicate of observablehq/framework#1747

[Fil]

I gave an answer here observablehq/framework#1747 (reply in thread)