Recommended package for creating tables in Observable Framework?

Community Help
1

Hi,

I am starting to use Observable Framework and I really like it. Everything works smoothly! Coming from an R background, it’s nice to be able to create lots of content using similar tools compared to what I do in R:

  • Markdown for content
  • Plot for plots
  • Arquero for working with data (or even R, with data loaders
  • etc

What I am missing though is some way to create customised tables for the data. Not only for the input data (for which I can use Inputs.table()) but also for data summaries etc. Something similar to what the gt and reactable packages do. The R package reactable is itself a wrapper around the JS React Table package but I don’t seem to find much example code of this package used in Observable notebooks.

Is there some recommended best practice/package for this task? Am I missing something obvious?

2

Thanks for the links. I like the reactable demo, the presentation is very elegant.

I don’t think you are missing anything obvious, the best thing we have for now is probably Inputs.table (but you could use any other npm module).

When you mention data summaries, are you referring to the automatic column summaries like those that appear at the top of each column in observable notebooks’ data table cells?

2582×1262 335 KB

Recreating this in Framework is something that we are actively working on (Summary data table display · Issue #23 · observablehq/framework · GitHub). Nothing to show yet, but I’m happy to hear about use cases and suggestions.

3

With data summaries I mean the output of some data analysis. A typical case would be to group the data palmerpenguins data by species and sex and calculate average body_mass_g and showing the results in a table. Or similar operations to this one.
One example table here

1 Like
4

I’m sorry I don’t know of a (ready-made) module that would make this task simpler. And writing HTML table code is a bit tedious.

5

this is nice, too
https://posit-dev.github.io/great-tables/blog/introduction-0.4.0/

6

The table ecosystem in R is very rich. great_tables is an attempt to translate gt into python, but it’s in an initial phase.

I was hopping for some JS package for creating tables, with a similar philosophy to plot :heart_eyes: One can dream! :slight_smile:

7

You mentioned reactable and React Table, and upon looking at React Table’s website, it mentions AG Grid being their partner.

I haven’t used R, reactable, or React Table before but I do know AG Grid. AG Grid does have JS distribution so you can use require to add it to a Notebook and use in it.

E.g.: AG Grid in Observable Notebook / MP_Li | Observable

Ref:
Require | Observable documentation
JavaScript Grid: Quick Start | AG Grid

1 Like