GMapPlotアニメーション/ Python/Bokeh

Question

私は非常にnoobyプログラマーです、これは私の最初のスタックオーバーフローの質問です。 :)

私はPythonを使用してGoogleマップで車の旅行をアニメーションしようとしています。私は最初にmatplotlibを使用し、パスライン上にアニメーション化されたドットを得ることができました...そして、bokehを使ってみると、Googleマップ上にオーバーレイするパスを得ました...

私の問題は、両方を行う良い方法（Googleマップ上のプロットをアニメーション化する）。

私のデータは、緯度/経度座標の形式です。

アドバイスはありますか？前もって感謝します！

EDIT：gmapplotを行うコードはここにあります...私はGMAPを持たないアニメーションよりむしろこれを持っていて、アニメーションがありません。私の目標は、その "車"の点をアニメ化することです。

import numpy as np 
from bokeh.io import output_file, show, vform 
from bokeh.models.widgets import Dropdown 
from bokeh.models import (GMapPlot, GMapOptions, ColumnDataSource, Line, Circle, 
    DataRange1d, PanTool, WheelZoomTool, BoxSelectTool, HoverTool) 

data = np.genfromtxt('Desktop\Temp Data for Python\test data 3.csv', delimiter=',', 
    names=True) 

map_options = GMapOptions(lat=np.average(data['Latitude']), 
    lng=np.average(data['Longitude']), map_type="roadmap", zoom=13) 

plot = GMapPlot(x_range=DataRange1d(), y_range=DataRange1d(), map_options=map_options, 
    title="My Drive") 

source = ColumnDataSource(data=dict(lat=data['Latitude'], lon=data['Longitude'], 
    speed=data['GpsSpeed'],)) 

path = Line(x="lon", y="lat", line_width = 2, line_color='blue') 
car = Circle(x=data['Longitude'][0], y=data['Latitude'][0], size=5, fill_color='red') 

plot.add_glyph(source, path) 
plot.add_glyph(source, car) 
plot.add_tools(PanTool(), WheelZoomTool(), BoxSelectTool(), 
    HoverTool(tooltips=[("Speed", "@speed"),])) 

output_file("gmap_plot.html") 
show(plot) 

Answer 1

これは、あなたが探しているまさにではないかもしれないが、あなたはあなたの車のドットの位置を制御するスライダーウィジェットを持つことができます。スライスの使用を開始したときに、bokehのドキュメント（またはgithubリポジトリ、私が覚えていない）にあるスライダの例が私を助けました。

ちょうどあなたが知っているように、正しい位置に緯度の点が表示されていました。約10ピクセルのオフセットがあります。これは未解決の問題です（github issue 2964）。あなたはそれがが動作するはずGMapPlotにFigureから、それを変更した場合

次のコードは、現在だけで、一般的なボケ図を生成するが、理論的にはされています。私はGMapPlotsで直接これを動作させることができませんでした。私はこれがgithub問題3737のためかもしれないと思う。私はbokehのdocsからAustinの例を実行することもできない。

うまくいけば、これはあなたには、いくつかのサンプルコードを一緒に入れていいですあなたの心

from bokeh.plotting import Figure, ColumnDataSource, show, vplot 
from bokeh.io import output_file 
from bokeh.models import (Slider, CustomJS, GMapPlot, 
          GMapOptions, DataRange1d, Circle, Line) 
import numpy as np 

output_file("path.html") 

# Create path around roundabout 
r = 0.000192 

x1 = np.linspace(-1,1,100)*r 
x2 = np.linspace(1,-1,100)*r 
x = np.hstack((x1,x2)) 

f = lambda x : np.sqrt(r**2 - x**2) 

y1 = f(x1) 
y2 = -f(x2) 
y = np.hstack((y1,y2)) 

init_x = 40.233688 
init_y = -111.646784 

lon = init_x + x 
lat = init_y + y 

# Initialize data sources. 
location = ColumnDataSource(data=dict(x=[lon[0]], y=[lat[0]])) 
path = ColumnDataSource(data=dict(x=lon, y=lat)) 

# Initialize figure, path, and point 
"""I haven't been able to verify that the GMapPlot code below works, but 
this should be the right thing to do. The zoom may be totally wrong, 
but my latlng points should be a path around a roundabout. 
""" 
##options = GMapOptions(lat=40.233681, lon=-111.646595, map_type="roadmap", zoom=15) 
##fig = GMapPlot(x_range=DataRange1d(), y_range=DataRange1d(), map_options=options) 

fig = Figure(plot_height=600, plot_width=600) 

c = Circle(x='x', y='y', size=10) 
p = Line(x='x', y='y') 

fig.add_glyph(location, c) 
fig.add_glyph(path, p) 

# Slider callback 
callback = CustomJS(args=dict(location=location, path=path), code=""" 
    var loc = location.get('data'); 
    var p = path.get('data'); 

    t = cb_obj.get('value'); 

    /* set the point location to the path location that 
     corresponds to the slider position */ 
    loc['x'][0] = p['x'][t]; 
    loc['y'][0] = p['y'][t]; 

    location.trigger('change'); 
""") 

# The way I have written this, 'start' has to be 0 and 
# 'end' has to be the length of the array of path points. 
slider = Slider(start=0, end=200, step=1, callback=callback) 

show(vplot(fig, slider))