livebook-dev/livebook
1
1
Fork 0
mirror of https://github.com/livebook-dev/livebook.git synced 2025-09-11 23:44:23 +08:00
Code Issues Projects Releases Packages Wiki Activity

Add interactive point selection examples to VegaLite guide (#2612)

Browse source 
Co-authored-by: Jonatan Kłosko <jonatanklosko@gmail.com>
This commit is contained in:
Cristine Guadelupe 2024-12-04 19:46:09 +08:00 • committed by GitHub
parent 5e0311beb7
commit ba59baa9fe
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 46 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
lib/livebook/notebook/learn/intro_to_vega_lite.livemd
View file

@ -998,6 +998,52 @@ Vl.new()
]) ])
``` ```
### Single point
Highlighting a single point by clicking on it.
```elixir
Vl.new(width: 400, height: 300)
|> Vl.data_from_url("https://vega.github.io/editor/data/cars.json")
|> Vl.param("pts", select: :point)
|> Vl.mark(:point)
|> Vl.encode_field(:x, "Horsepower", type: :quantitative)
|> Vl.encode_field(:y, "Miles_per_Gallon", type: :quantitative)
|> Vl.encode(:color,
condition: [
param: "pts",
field: "Cylinders",
type: :ordinal,
scale: [scheme: "yelloworangebrown"]
],
value: :gray
)
|> Vl.encode(:size, condition: [param: "pts", empty: false, value: 200], value: 50)
```
### Multiple points
Highlighting a group of matching points by clicking on one of them.
```elixir
Vl.new(width: 400, height: 300)
|> Vl.data_from_url("https://vega.github.io/editor/data/cars.json")
|> Vl.param("pts", select: [type: :point, fields: ["Cylinders"]])
|> Vl.mark(:point)
|> Vl.encode_field(:x, "Horsepower", type: :quantitative)
|> Vl.encode_field(:y, "Miles_per_Gallon", type: :quantitative)
|> Vl.encode(:color,
condition: [
param: "pts",
field: "Cylinders",
type: :ordinal,
scale: [scheme: "yelloworangebrown"]
],
value: :gray
)
|> Vl.encode(:size, condition: [param: "pts", empty: false, value: 200], value: 50)
```
### Map connections ### Map connections
An interactive visualization of connections between locations on a map. An interactive visualization of connections between locations on a map.