Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Try to render two key frames with vega(lite?) and animate between them #12

Closed
jhofman opened this issue Apr 7, 2021 · 7 comments
Closed
Assignees

Comments

@jhofman
Copy link
Contributor

jhofman commented Apr 7, 2021

It looks like Vega (or Vega-lite) might be a good "exchange format" for passing plot specifications between a base language (like R) and a rendering language (like d3).

For now, let's try to just make plots of two key frames from the salary datamation using it and see if we can link them with a transition. Specifically:

Frame 1: Scatter plot of x = degree, y = salary, color = degree
Frame 2: Plot of average salary by degree, x = degree, y = mean_salary, color = degree

@jhofman
Copy link
Contributor Author

jhofman commented Apr 7, 2021

If this is successful in "vanilla" Vega, then let's see if we can generate the same from R using one of these:

@jhofman jhofman changed the title Try to render two key frames with vega and animate between them Try to render two key frames with vega(lite?) and animate between them Apr 7, 2021
@giorgi-ghviniashvili
Copy link
Collaborator

Hi @jhofman ,

I managed to draw the two frames using vega-lite.

And also updating between these two frames. Here is the video:

vega.mov

My thoughts about vega,

  • it does not support animation.
  • vega lite is a lighter version of vega. In vega, we would need to write too much, and vega light just helps us to avoid typing same things over and over again.
  • it is not possible or at least not documented anywhere how can I use d3-force to make collision detections.
  • vega-lite is compiled to vega (full json specification). See vega vs vega-light
  • if we want to use scheme only, but do the rendering using d3, then we will need to parse vega format (or compile vega-lite to vega).

@sharlagelfand
Copy link
Collaborator

Reading around a bit about animation with Vega (seems like a popular request!) (side note - someone linked SandDance which I didn't know about, so now I "get" the datamation_sanddance() name 😄)

One thing that was linked is gemini, which is a grammar for animating between vega/vega-lite charts. Seems like it may still be in the prototype stage, but has a paper to accompany it.

On the R side, vegawidget looks like the best option to explore - I'll dig into it today.

@jhofman
Copy link
Contributor Author

jhofman commented Apr 8, 2021

@sharlagelfand, excellent sleuthing, and sorry to have not explained the sanddance connection before! sounds good on exploring vegawidget. would also be curious to know if ggvis outputs vega(lite) specs.

turns out we got the same lead on gemini from talk to a friend yesterday afternoon. and the same authors have a nice paper on creating animations to show different types of animations (mean, max, sd, etc.). (see #18.)

so the plan is that @giorgi-ghviniashvili is going to:

  1. Read the papers behind gemini and aggregate animations from Younghoon Kim & co.
  2. Try to use gemini to animate between two frames in the salary datamation.
  3. If that's successful, think about whether the aggregate animations can be implemented with gemini as well, or if it has limitations that would prevent us from using it if/when we want to do more "custom" animations.

@jhofman
Copy link
Contributor Author

jhofman commented Apr 8, 2021

It's also possible that Altair is worth looking at.

There is an R package for Altair that is called altair (with a lowercase A, somewhat confusingly). But it seems like this might actually call out to Python just to generate vegalite?

@sharlagelfand
Copy link
Collaborator

Some initial exploration of vegawidget: https://github.com/jhofman/datamations/blob/vegawidget-exploration/sandbox/vegawidget/vegawidget_exploration.R, looking at how to create a spec in R (+ how to visualize it in R or export it to JSON) and where the spec could come in based on existing coordinates data that is calculated by datamations already

@giorgi-ghviniashvili
Copy link
Collaborator

giorgi-ghviniashvili commented Apr 9, 2021

Hi @jhofman.

I managed to animate with gemini.

gemini-1.mov

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants