pbugnion / gmaps

Google maps for Jupyter notebooks
https://jupyter-gmaps.readthedocs.io/en/stable/
Other
760 stars 147 forks source link

Ability to Animate the heatmap #216

Closed georgegach closed 6 years ago

georgegach commented 6 years ago

Guys is there any way to animate Gmaps?

pbugnion commented 6 years ago

is there any way to animate Gmaps?

Thanks for raising this. Can you give a more concrete example of what you're trying to do? It'll help me give a more targeted answer. For instance:

georgegach commented 6 years ago

Thanks for answering. So, basically, I just want a sequence of heatmaps rendered as an animation. Don't need the heatmap to be fluidly animated or anything, just a plain-old stop-motion sequence.

As an example: temporally segmented taxi trip pickup points so animation would show how heatmap changes over time with say 1-hour interval per second.


figures = []
for ts in sorted(df["bins"].unique()):
    fig = gmaps.figure()
    fig.add_layer(gmaps.heatmap_layer(df[df["bins"] == ts][["pickup_latitude","pickup_longitude"]])
    figures.append(fig)

To answer your questions

I tried running for loop with sleep(1) for the array of figures but can't output widget from there.

for fig in figures:
    sleep(1)
    fig

Essentially bulk PNG screenshot export would also work and later I'd just compile it in some external video editor software. However, that's even harder I presume, since the way I see the implementation of PNG download entirely relies on the map being fully loaded and visible within the browser window. (i.e: If the map is half visible, not fully scrolled, downloaded image is also only half. Not sure if you are already aware of that)

pbugnion commented 6 years ago

On gmaps 0.7.1 (just released) this is fairly straightforward:

import gmaps
import time
from IPython.display import display

gmaps.configure(api_key="AIzaS...5Ys")

# Dummy data -- we will cycle through each of these on our heatmap.
datasets = [
    [(0.0, 1.0), (-2.0, 7.0)],
    [(-5.0, 1.0), (-7.0, 3.0), (4.0, 1.0)],
    [(-1.0, 3.0), (-7.0, 4.0), (1.0, -1.0)],
]

class HeatmapAnimation(object):

    def __init__(self, datasets):
        self._datasets = datasets
        self._figure = gmaps.figure(center=(0.0, 0.0), zoom_level=4)
        self._current_index = 0
        self._heatmap = gmaps.heatmap_layer(datasets[self._current_index])
        self._figure.add_layer(self._heatmap)

    def render(self):
        return display(self._figure)

    def start_animation(self):
        while True:
            self._current_index = (self._current_index + 1) % len(datasets)
            self._render_current_dataset()
            time.sleep(1)

    def _render_current_dataset(self):
        self._heatmap.locations = datasets[self._current_index] # update the locations drawn on the heatmap

animation = HeatmapAnimation(datasets)
animation.render()
animation.start_animation()

gmaps-animation-demo

pbugnion commented 6 years ago

For more granular control, including a 'stop' and 'play' button, you could use the Play widget from ipywidgets: you would observe the .value attribute on the Play widget and, for every change, call _render_current_dataset in the example above.

In general, jupyter-gmaps instances are supposed to fit in well with other ipywidget components.

pbugnion commented 6 years ago

Closing as resolved. Feel free to re-open if something's not working.

georgegach commented 6 years ago

Worked like a charm! Thanks a lot!

ianweb1000 commented 6 years ago

Thanks for providing this function , i am new to gmaps i tried to used but failed on setting the lat and long when looking at the error it mention lat, long -90 to 90 , how do i set for another location? for example this case canberra? please see my code below..

import gmaps import time from IPython.display import display

gmaps.configure(api_key='AIzaSyDAe1GlPQ51-2cjZ-HRUpD4JVuIXXXXX')

Dummy data -- we will cycle through each of these on our heatmap.

datasets = [ [(149.0595142, -35.35740608), (149.0639612, -35.24647741)], [(149.076662, -35.34001262), (149.0906542, -35.17645172), (149.1339467, -35.24790358)], [(149.1324299, -35.21837069), (149.0626767, -35.31481163)], [(149.1670283, -35.32215575), (149.1302218, -35.27727051), (149.1251359, -35.23272604)], [(149.1262604, -35.3121351), (149.1434543, -35.33714495), (149.059198, -35.27239083)], [(149.1251335, -35.27747377), (149.1774986, -35.32820705), (149.1689661, -35.3233789)], [(149.1231831, -35.3052885), (149.1302284, -35.27426931), (149.1015366, -35.4612582)], [(149.1958394, -35.23103345), (149.1244066, -35.30749543), (149.0857978, -35.33542881)], ] class HeatmapAnimation(object):

def __init__(self, datasets):
    self._datasets = datasets
    self._figure = gmaps.figure(center=(-35.289, 149.130092), zoom_level=4)
    self._current_index = 0
    self._heatmap = gmaps.heatmap_layer(datasets[self._current_index])
    self._figure.add_layer(self._heatmap)

def render(self):
    return display(self._figure)

def start_animation(self):
    while True:
        self._current_index = (self._current_index + 1) % len(datasets)
        self._render_current_dataset()
        time.sleep(1)

def _render_current_dataset(self):
    self._heatmap.locations = datasets[self._current_index] # update the locations drawn on the heatmap

animation = HeatmapAnimation(datasets) animation.render() animation.start_animation()

Error

InvalidPointException: 149.0639612 is not a valid latitude. Latitudes must lie between -90 and 90.

pbugnion commented 6 years ago

This has nothing to do with the issue you posted on, so I created a new issue: #270 . Having separate problems addressed in distinct GitHub issues helps with discoverability for people with the same problem as you.

ianweb1000 commented 6 years ago

Thanks Pascal, this package is awesome I’m manage to make a heatmap put some static speed cameras , hopefully with the animation the project will shine. I have also read all the documentation. I think will be nice to add animation to the documentation. As a separate question, does gmaps interact with bokeh or plots?

Kind Regards ... ian de oliveira

On 26 Sep 2018, at 4:08 pm, Pascal Bugnion notifications@github.com<mailto:notifications@github.com> wrote:

This has nothing to do with the issue you posted on, so I created a new issue: #270https://github.com/pbugnion/gmaps/issues/270 .

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/pbugnion/gmaps/issues/216#issuecomment-424596033, or mute the threadhttps://github.com/notifications/unsubscribe-auth/Af0rtedTV974_fEi1S6cjQv9mpN05ueaks5uexnNgaJpZM4R_ZaU.

pbugnion commented 6 years ago

Please open new issues to ask new questions. This helps discoverability for new users who might have the same questions as you. In the meantime, have a look at issue #270.

ianweb1000 commented 6 years ago

Sure will, sorry about it .

Kind Regards ... ian de oliveira

On 26 Sep 2018, at 4:55 pm, Pascal Bugnion notifications@github.com<mailto:notifications@github.com> wrote:

Please open new issues to ask new questions. This helps discoverability for new users who might have the same questions as you. In the meantime, have a look at issue #270https://github.com/pbugnion/gmaps/issues/270.

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/pbugnion/gmaps/issues/216#issuecomment-424605934, or mute the threadhttps://github.com/notifications/unsubscribe-auth/Af0rtaZtp2IvB_E8qnwZEiC6Vp8FbYQ1ks5ueyTPgaJpZM4R_ZaU.

pbugnion commented 6 years ago

No worries! Thanks for the kind words.

ry-werth commented 5 years ago

Awesome codebase, I have really enjoyed playing with it! I got this animation working for a heat map, but could not get it to work when using symbol_layer. My locations were updating correctly in the _render_current_dataset function, but the map was not showing these new points. Any idea on why this is and how I can fix it? Thanks again!