developmentseed / lonboard

A Python library for fast, interactive geospatial vector data visualization in Jupyter.
https://developmentseed.org/lonboard/latest/
MIT License
568 stars 28 forks source link

Record and export animations #405

Open kylebarron opened 6 months ago

kylebarron commented 6 months ago

A powerful feature would be to export image stills or video screencasts from a map. This would be really exciting for power users to make e.g. content for presentations.

There's a JS library called hubble.gl that creates animations from deck.gl maps. For example the following video is created from this example.

4bf79c3f-ba20-c98b-927c-0be9184f08d6.webm

In theory this might not be too hard to support. The basic animation example is pretty minimal, and most importantly the user input is all json-serializable, so it would be relatively easy to expose to a user.

After creating the video, in theory we could send the data back from the browser to Python, but it seems a lot easier to just "download" the video from the user's browser.

batpad commented 3 months ago

This is how it's being done in gl-director - if one just wants the user to hit "Record", do what they want with the map, "Stop Recording" and then be able to download a video file: https://github.com/developmentseed/gl-director/blob/main/app/assets/scripts/components/home/video-pane.js#L62 - I think that same approach should work.

kylebarron commented 3 months ago

Note that I would guess that uses a different mechanism than what hubble.gl is using. In particular, hubble.gl hooks directly into the map itself. This means that it can ensure all the data has been loaded and rendered for every keyframe. So the generated animation looks perfectly smooth.

I'm guessing that if you used gl-director, it records the map just the same as if you were manually dragging the map?

batpad commented 3 months ago

I'm guessing that if you used gl-director, it records the map just the same as if you were manually dragging the map?

Yea, gl-director hooks directly onto the canvas element so would just record whatever is happening there, and yes, this would likely replicate any rendering lag in the video.

Hubble.gl looks cool - if you think we could hook that up and give more granular control over frame-rate, etc. that does sound likely better.

kylebarron commented 3 months ago

I think it's definitely possible to connect it to Lonboard. It might take a day or two to explore how the integration would work