Observable Inputs.table from R data.frame / tibble

Demo

fdfd

library(tidyverse)

R: ggplot toy

ggplot(mpg, aes(x = hwy, y = cty, color = cyl)) +
  geom_point(alpha = 0.5, size = 2) +
  scale_color_viridis_c() +
  theme_minimal()

Transpose R data object

R df / tibble needs to be transposed for Observable’s Inputs.table
Inputs.table needs an Array of Objects to iterate over

Consider turning this into a function
Consider how to account for potential row names

data_raw <- mtcars %>%
  rownames_to_column("car") %>%
  # tibble() %>%
  transpose()
typeof(mtcars)
[1] "list"
class(mtcars)
[1] "data.frame"
str(mtcars)
'data.frame':   32 obs. of  11 variables:
 $ mpg : num  21 21 22.8 21.4 18.7 18.1 14.3 24.4 22.8 19.2 ...
 $ cyl : num  6 6 4 6 8 6 8 4 4 6 ...
 $ disp: num  160 160 108 258 360 ...
 $ hp  : num  110 110 93 110 175 105 245 62 95 123 ...
 $ drat: num  3.9 3.9 3.85 3.08 3.15 2.76 3.21 3.69 3.92 3.92 ...
 $ wt  : num  2.62 2.88 2.32 3.21 3.44 ...
 $ qsec: num  16.5 17 18.6 19.4 17 ...
 $ vs  : num  0 0 1 1 0 1 0 1 1 1 ...
 $ am  : num  1 1 1 0 0 0 0 0 0 0 ...
 $ gear: num  4 4 4 3 3 3 3 4 4 4 ...
 $ carb: num  4 4 1 1 2 1 4 2 2 4 ...
typeof(data_raw)
[1] "list"
class(data_raw)
[1] "list"
str(data_raw)
List of 32
 $ :List of 12
  ..$ car : chr "Mazda RX4"
  ..$ mpg : num 21
  ..$ cyl : num 6
  ..$ disp: num 160
  ..$ hp  : num 110
  ..$ drat: num 3.9
  ..$ wt  : num 2.62
  ..$ qsec: num 16.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Mazda RX4 Wag"
  ..$ mpg : num 21
  ..$ cyl : num 6
  ..$ disp: num 160
  ..$ hp  : num 110
  ..$ drat: num 3.9
  ..$ wt  : num 2.88
  ..$ qsec: num 17
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Datsun 710"
  ..$ mpg : num 22.8
  ..$ cyl : num 4
  ..$ disp: num 108
  ..$ hp  : num 93
  ..$ drat: num 3.85
  ..$ wt  : num 2.32
  ..$ qsec: num 18.6
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Hornet 4 Drive"
  ..$ mpg : num 21.4
  ..$ cyl : num 6
  ..$ disp: num 258
  ..$ hp  : num 110
  ..$ drat: num 3.08
  ..$ wt  : num 3.21
  ..$ qsec: num 19.4
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Hornet Sportabout"
  ..$ mpg : num 18.7
  ..$ cyl : num 8
  ..$ disp: num 360
  ..$ hp  : num 175
  ..$ drat: num 3.15
  ..$ wt  : num 3.44
  ..$ qsec: num 17
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Valiant"
  ..$ mpg : num 18.1
  ..$ cyl : num 6
  ..$ disp: num 225
  ..$ hp  : num 105
  ..$ drat: num 2.76
  ..$ wt  : num 3.46
  ..$ qsec: num 20.2
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Duster 360"
  ..$ mpg : num 14.3
  ..$ cyl : num 8
  ..$ disp: num 360
  ..$ hp  : num 245
  ..$ drat: num 3.21
  ..$ wt  : num 3.57
  ..$ qsec: num 15.8
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 240D"
  ..$ mpg : num 24.4
  ..$ cyl : num 4
  ..$ disp: num 147
  ..$ hp  : num 62
  ..$ drat: num 3.69
  ..$ wt  : num 3.19
  ..$ qsec: num 20
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Merc 230"
  ..$ mpg : num 22.8
  ..$ cyl : num 4
  ..$ disp: num 141
  ..$ hp  : num 95
  ..$ drat: num 3.92
  ..$ wt  : num 3.15
  ..$ qsec: num 22.9
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Merc 280"
  ..$ mpg : num 19.2
  ..$ cyl : num 6
  ..$ disp: num 168
  ..$ hp  : num 123
  ..$ drat: num 3.92
  ..$ wt  : num 3.44
  ..$ qsec: num 18.3
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 280C"
  ..$ mpg : num 17.8
  ..$ cyl : num 6
  ..$ disp: num 168
  ..$ hp  : num 123
  ..$ drat: num 3.92
  ..$ wt  : num 3.44
  ..$ qsec: num 18.9
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 450SE"
  ..$ mpg : num 16.4
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 4.07
  ..$ qsec: num 17.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Merc 450SL"
  ..$ mpg : num 17.3
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 3.73
  ..$ qsec: num 17.6
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Merc 450SLC"
  ..$ mpg : num 15.2
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 3.78
  ..$ qsec: num 18
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Cadillac Fleetwood"
  ..$ mpg : num 10.4
  ..$ cyl : num 8
  ..$ disp: num 472
  ..$ hp  : num 205
  ..$ drat: num 2.93
  ..$ wt  : num 5.25
  ..$ qsec: num 18
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Lincoln Continental"
  ..$ mpg : num 10.4
  ..$ cyl : num 8
  ..$ disp: num 460
  ..$ hp  : num 215
  ..$ drat: num 3
  ..$ wt  : num 5.42
  ..$ qsec: num 17.8
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Chrysler Imperial"
  ..$ mpg : num 14.7
  ..$ cyl : num 8
  ..$ disp: num 440
  ..$ hp  : num 230
  ..$ drat: num 3.23
  ..$ wt  : num 5.34
  ..$ qsec: num 17.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Fiat 128"
  ..$ mpg : num 32.4
  ..$ cyl : num 4
  ..$ disp: num 78.7
  ..$ hp  : num 66
  ..$ drat: num 4.08
  ..$ wt  : num 2.2
  ..$ qsec: num 19.5
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Honda Civic"
  ..$ mpg : num 30.4
  ..$ cyl : num 4
  ..$ disp: num 75.7
  ..$ hp  : num 52
  ..$ drat: num 4.93
  ..$ wt  : num 1.61
  ..$ qsec: num 18.5
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Toyota Corolla"
  ..$ mpg : num 33.9
  ..$ cyl : num 4
  ..$ disp: num 71.1
  ..$ hp  : num 65
  ..$ drat: num 4.22
  ..$ wt  : num 1.83
  ..$ qsec: num 19.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Toyota Corona"
  ..$ mpg : num 21.5
  ..$ cyl : num 4
  ..$ disp: num 120
  ..$ hp  : num 97
  ..$ drat: num 3.7
  ..$ wt  : num 2.46
  ..$ qsec: num 20
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Dodge Challenger"
  ..$ mpg : num 15.5
  ..$ cyl : num 8
  ..$ disp: num 318
  ..$ hp  : num 150
  ..$ drat: num 2.76
  ..$ wt  : num 3.52
  ..$ qsec: num 16.9
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "AMC Javelin"
  ..$ mpg : num 15.2
  ..$ cyl : num 8
  ..$ disp: num 304
  ..$ hp  : num 150
  ..$ drat: num 3.15
  ..$ wt  : num 3.44
  ..$ qsec: num 17.3
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Camaro Z28"
  ..$ mpg : num 13.3
  ..$ cyl : num 8
  ..$ disp: num 350
  ..$ hp  : num 245
  ..$ drat: num 3.73
  ..$ wt  : num 3.84
  ..$ qsec: num 15.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Pontiac Firebird"
  ..$ mpg : num 19.2
  ..$ cyl : num 8
  ..$ disp: num 400
  ..$ hp  : num 175
  ..$ drat: num 3.08
  ..$ wt  : num 3.85
  ..$ qsec: num 17.1
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Fiat X1-9"
  ..$ mpg : num 27.3
  ..$ cyl : num 4
  ..$ disp: num 79
  ..$ hp  : num 66
  ..$ drat: num 4.08
  ..$ wt  : num 1.94
  ..$ qsec: num 18.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Porsche 914-2"
  ..$ mpg : num 26
  ..$ cyl : num 4
  ..$ disp: num 120
  ..$ hp  : num 91
  ..$ drat: num 4.43
  ..$ wt  : num 2.14
  ..$ qsec: num 16.7
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Lotus Europa"
  ..$ mpg : num 30.4
  ..$ cyl : num 4
  ..$ disp: num 95.1
  ..$ hp  : num 113
  ..$ drat: num 3.77
  ..$ wt  : num 1.51
  ..$ qsec: num 16.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Ford Pantera L"
  ..$ mpg : num 15.8
  ..$ cyl : num 8
  ..$ disp: num 351
  ..$ hp  : num 264
  ..$ drat: num 4.22
  ..$ wt  : num 3.17
  ..$ qsec: num 14.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Ferrari Dino"
  ..$ mpg : num 19.7
  ..$ cyl : num 6
  ..$ disp: num 145
  ..$ hp  : num 175
  ..$ drat: num 3.62
  ..$ wt  : num 2.77
  ..$ qsec: num 15.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 6
 $ :List of 12
  ..$ car : chr "Maserati Bora"
  ..$ mpg : num 15
  ..$ cyl : num 8
  ..$ disp: num 301
  ..$ hp  : num 335
  ..$ drat: num 3.54
  ..$ wt  : num 3.57
  ..$ qsec: num 14.6
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 8
 $ :List of 12
  ..$ car : chr "Volvo 142E"
  ..$ mpg : num 21.4
  ..$ cyl : num 4
  ..$ disp: num 121
  ..$ hp  : num 109
  ..$ drat: num 4.11
  ..$ wt  : num 2.78
  ..$ qsec: num 18.6
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 2
typeof(tibble(mtcars))
[1] "list"
class(tibble(mtcars))
[1] "tbl_df"     "tbl"        "data.frame"
str(data_raw_2)
List of 32
 $ :List of 12
  ..$ car : chr "Mazda RX4"
  ..$ mpg : num 21
  ..$ cyl : num 6
  ..$ disp: num 160
  ..$ hp  : num 110
  ..$ drat: num 3.9
  ..$ wt  : num 2.62
  ..$ qsec: num 16.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Mazda RX4 Wag"
  ..$ mpg : num 21
  ..$ cyl : num 6
  ..$ disp: num 160
  ..$ hp  : num 110
  ..$ drat: num 3.9
  ..$ wt  : num 2.88
  ..$ qsec: num 17
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Datsun 710"
  ..$ mpg : num 22.8
  ..$ cyl : num 4
  ..$ disp: num 108
  ..$ hp  : num 93
  ..$ drat: num 3.85
  ..$ wt  : num 2.32
  ..$ qsec: num 18.6
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Hornet 4 Drive"
  ..$ mpg : num 21.4
  ..$ cyl : num 6
  ..$ disp: num 258
  ..$ hp  : num 110
  ..$ drat: num 3.08
  ..$ wt  : num 3.21
  ..$ qsec: num 19.4
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Hornet Sportabout"
  ..$ mpg : num 18.7
  ..$ cyl : num 8
  ..$ disp: num 360
  ..$ hp  : num 175
  ..$ drat: num 3.15
  ..$ wt  : num 3.44
  ..$ qsec: num 17
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Valiant"
  ..$ mpg : num 18.1
  ..$ cyl : num 6
  ..$ disp: num 225
  ..$ hp  : num 105
  ..$ drat: num 2.76
  ..$ wt  : num 3.46
  ..$ qsec: num 20.2
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Duster 360"
  ..$ mpg : num 14.3
  ..$ cyl : num 8
  ..$ disp: num 360
  ..$ hp  : num 245
  ..$ drat: num 3.21
  ..$ wt  : num 3.57
  ..$ qsec: num 15.8
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 240D"
  ..$ mpg : num 24.4
  ..$ cyl : num 4
  ..$ disp: num 147
  ..$ hp  : num 62
  ..$ drat: num 3.69
  ..$ wt  : num 3.19
  ..$ qsec: num 20
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Merc 230"
  ..$ mpg : num 22.8
  ..$ cyl : num 4
  ..$ disp: num 141
  ..$ hp  : num 95
  ..$ drat: num 3.92
  ..$ wt  : num 3.15
  ..$ qsec: num 22.9
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Merc 280"
  ..$ mpg : num 19.2
  ..$ cyl : num 6
  ..$ disp: num 168
  ..$ hp  : num 123
  ..$ drat: num 3.92
  ..$ wt  : num 3.44
  ..$ qsec: num 18.3
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 280C"
  ..$ mpg : num 17.8
  ..$ cyl : num 6
  ..$ disp: num 168
  ..$ hp  : num 123
  ..$ drat: num 3.92
  ..$ wt  : num 3.44
  ..$ qsec: num 18.9
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 4
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Merc 450SE"
  ..$ mpg : num 16.4
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 4.07
  ..$ qsec: num 17.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Merc 450SL"
  ..$ mpg : num 17.3
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 3.73
  ..$ qsec: num 17.6
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Merc 450SLC"
  ..$ mpg : num 15.2
  ..$ cyl : num 8
  ..$ disp: num 276
  ..$ hp  : num 180
  ..$ drat: num 3.07
  ..$ wt  : num 3.78
  ..$ qsec: num 18
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 3
 $ :List of 12
  ..$ car : chr "Cadillac Fleetwood"
  ..$ mpg : num 10.4
  ..$ cyl : num 8
  ..$ disp: num 472
  ..$ hp  : num 205
  ..$ drat: num 2.93
  ..$ wt  : num 5.25
  ..$ qsec: num 18
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Lincoln Continental"
  ..$ mpg : num 10.4
  ..$ cyl : num 8
  ..$ disp: num 460
  ..$ hp  : num 215
  ..$ drat: num 3
  ..$ wt  : num 5.42
  ..$ qsec: num 17.8
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Chrysler Imperial"
  ..$ mpg : num 14.7
  ..$ cyl : num 8
  ..$ disp: num 440
  ..$ hp  : num 230
  ..$ drat: num 3.23
  ..$ wt  : num 5.34
  ..$ qsec: num 17.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Fiat 128"
  ..$ mpg : num 32.4
  ..$ cyl : num 4
  ..$ disp: num 78.7
  ..$ hp  : num 66
  ..$ drat: num 4.08
  ..$ wt  : num 2.2
  ..$ qsec: num 19.5
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Honda Civic"
  ..$ mpg : num 30.4
  ..$ cyl : num 4
  ..$ disp: num 75.7
  ..$ hp  : num 52
  ..$ drat: num 4.93
  ..$ wt  : num 1.61
  ..$ qsec: num 18.5
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Toyota Corolla"
  ..$ mpg : num 33.9
  ..$ cyl : num 4
  ..$ disp: num 71.1
  ..$ hp  : num 65
  ..$ drat: num 4.22
  ..$ wt  : num 1.83
  ..$ qsec: num 19.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Toyota Corona"
  ..$ mpg : num 21.5
  ..$ cyl : num 4
  ..$ disp: num 120
  ..$ hp  : num 97
  ..$ drat: num 3.7
  ..$ wt  : num 2.46
  ..$ qsec: num 20
  ..$ vs  : num 1
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Dodge Challenger"
  ..$ mpg : num 15.5
  ..$ cyl : num 8
  ..$ disp: num 318
  ..$ hp  : num 150
  ..$ drat: num 2.76
  ..$ wt  : num 3.52
  ..$ qsec: num 16.9
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "AMC Javelin"
  ..$ mpg : num 15.2
  ..$ cyl : num 8
  ..$ disp: num 304
  ..$ hp  : num 150
  ..$ drat: num 3.15
  ..$ wt  : num 3.44
  ..$ qsec: num 17.3
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Camaro Z28"
  ..$ mpg : num 13.3
  ..$ cyl : num 8
  ..$ disp: num 350
  ..$ hp  : num 245
  ..$ drat: num 3.73
  ..$ wt  : num 3.84
  ..$ qsec: num 15.4
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Pontiac Firebird"
  ..$ mpg : num 19.2
  ..$ cyl : num 8
  ..$ disp: num 400
  ..$ hp  : num 175
  ..$ drat: num 3.08
  ..$ wt  : num 3.85
  ..$ qsec: num 17.1
  ..$ vs  : num 0
  ..$ am  : num 0
  ..$ gear: num 3
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Fiat X1-9"
  ..$ mpg : num 27.3
  ..$ cyl : num 4
  ..$ disp: num 79
  ..$ hp  : num 66
  ..$ drat: num 4.08
  ..$ wt  : num 1.94
  ..$ qsec: num 18.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 1
 $ :List of 12
  ..$ car : chr "Porsche 914-2"
  ..$ mpg : num 26
  ..$ cyl : num 4
  ..$ disp: num 120
  ..$ hp  : num 91
  ..$ drat: num 4.43
  ..$ wt  : num 2.14
  ..$ qsec: num 16.7
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Lotus Europa"
  ..$ mpg : num 30.4
  ..$ cyl : num 4
  ..$ disp: num 95.1
  ..$ hp  : num 113
  ..$ drat: num 3.77
  ..$ wt  : num 1.51
  ..$ qsec: num 16.9
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 2
 $ :List of 12
  ..$ car : chr "Ford Pantera L"
  ..$ mpg : num 15.8
  ..$ cyl : num 8
  ..$ disp: num 351
  ..$ hp  : num 264
  ..$ drat: num 4.22
  ..$ wt  : num 3.17
  ..$ qsec: num 14.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 4
 $ :List of 12
  ..$ car : chr "Ferrari Dino"
  ..$ mpg : num 19.7
  ..$ cyl : num 6
  ..$ disp: num 145
  ..$ hp  : num 175
  ..$ drat: num 3.62
  ..$ wt  : num 2.77
  ..$ qsec: num 15.5
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 6
 $ :List of 12
  ..$ car : chr "Maserati Bora"
  ..$ mpg : num 15
  ..$ cyl : num 8
  ..$ disp: num 301
  ..$ hp  : num 335
  ..$ drat: num 3.54
  ..$ wt  : num 3.57
  ..$ qsec: num 14.6
  ..$ vs  : num 0
  ..$ am  : num 1
  ..$ gear: num 5
  ..$ carb: num 8
 $ :List of 12
  ..$ car : chr "Volvo 142E"
  ..$ mpg : num 21.4
  ..$ cyl : num 4
  ..$ disp: num 121
  ..$ hp  : num 109
  ..$ drat: num 4.11
  ..$ wt  : num 2.78
  ..$ qsec: num 18.6
  ..$ vs  : num 1
  ..$ am  : num 1
  ..$ gear: num 4
  ..$ carb: num 2

Expose to JS

Caution: ojs_define is
  • not available as an executable chunk from within the .qmd document
  • exposes the object / data in the client (search for <script type="ojs-define"> in the DOM tree)
ojs_define(data_raw)

JS Table from R data

dropdown with var names for dynamic sorting
pre-pending null to allow no choice as inital value

viewof dropdown = Inputs.select([null].concat(Object.keys(data_raw[0]).sort()),
  {value: null, label: "Sort by", 
  <!-- sort: true,  // or sort: "car"-->
  unique: true}
)
viewof tableData = Inputs.table(data_raw,
  {sort: dropdown, required: false,
    format: {
      mpg: sparkbar(d3.max(data_raw, d => d.mpg)),
      cyl: sparkbar(d3.max(data_raw, d => d.cyl)),
      disp: sparkbar(d3.max(data_raw, d => d.disp)),
      hp: sparkbar(d3.max(data_raw, d => d.hp)),
      qsec: sparkbar(d3.max(data_raw, d => d.qsec))
    }
  }
)
tableData

Bonus: Mean HP from seleted rows

Plot

min/max hp with R

Just a proof-of-concept; can be solved with ojs Plot generics

min <- min(mtcars$hp)
max <- max(mtcars$hp)
ojs_define(min)
ojs_define(max)
chart = Plot.plot({
  inset: 8,
  grid: true,
  facet: {
    data: data_raw,
    y: doFacet && "cyl"
  },
  color: {
    legend: true,
  },
  marks: [
    Plot.dot(data_raw,{filter: d => d.hp <= minimum, x: "cyl", y: "mpg", stroke: "car"})
  ]
})
viewof minimum = Inputs.range([min, max], { value: max, step: 1, label: "hp filter" })
viewof doFacet = Inputs.toggle({label: "Facet", value: true})
import {serialize} from "@mbostock/saving-svg"
<!-- rasterize -->
DOM.download(() => serialize(chart), undefined, "Save as SVG")
<!-- DOM.download(() => rasterize(chart), undefined, "Save as PNG") -->

Helper Functions

Sparkline for table

<!-- from https://observablehq.com/@observablehq/input-table#sparkbar -->
<!-- import {sparkbar} from "@observablehq/input-table" -->
function sparkbar(max) {
  return x => htl.html`<div style="
    background: lightblue;
    width: ${100 * x / max}%;
    float: right;
    padding-right: 3px;
    box-sizing: border-box;
    overflow: visible;
    display: flex;
    justify-content: end;">${x.toLocaleString("en")}`
}