tex in Table headers?

Community Help
1

How do I use tex in a table header?

When I do this:

data = [
  {model: 'model1', rSquared: 0.57},
  {model: 'model2', rSquared: 0.34},
]

and then this:

Inputs.table(data, {
  header: {
    rSquared: tex`R^2`
  }
})

the exponent in the resulting header is detached from the R:
https://observablehq.com/d/fc02eb0e7f17d1f5

2 Likes
2

This is a bug in Observable Inputs. This style rule is matching the contents of the TeX element:

The rule should be made more specific, like .__ns__-table > table > thead > th > span.

1 Like
3

Alternatively, you could use MathJax:

1 Like
4

Thank you to @mbostock for the explanation, @mcmcclur for the workaround, and @mootari for posting the bug to GitHub (Table styles affect table cell contents · Issue #241 · observablehq/inputs · GitHub).

1 Like
5

Adding the option below produces an R^2 of the right height to align with the other column heads:

rSquared: MathJax.tex2svg(String.rawR^2, {display: false})

And thanks, @mcmcclur, I needed this workaround.

1 Like