我有一个使用 OpenStreetMaps、Leaflet JS API 和 PostGIS 数据库的 map 解决方案。我有一个从跟踪设备调用的 API。设备以 30 秒的间隔发送数据(经度和纬度)。我已将 map 上的数据绘制为标记，并通过连接标记绘制多段线。现在我需要绘制实时和动画跟踪标记。我正在寻找类似于以下 gif 图像的解决方案。
https://i.imgur.com/KrOy634.gif
有一个名为Moving Marker 的Leaflet JS API 插件但我无法解决。它使用三个参数(2 个位置和动画持续时间)。我可以添加位置但无法控制持续时间。
var myMovingMarker = L.Marker.movingMarker([[48.8567, 2.3508],[50.45, 30.523333]],
[20000]).addTo(map);
myMovingMarker.start();
可视化实时移动跟踪的最佳方式是什么？我知道如果设备数据中有速度参数，那么它是可能的。不幸的是，设备数据中没有速度参数。
最佳答案
要正确执行此操作，我发现您需要获取点对点路线，然后遍历这些点以在位置轮询之间的时间段内为路径上的标记设置动画。我使用的基本方法是使用 OSRM 等服务获取从起点到终点的路线。通常，您需要将编码的多段线转换为一组点，然后创建一个计时器，该计时器会定期将标记位置更新为多段线中的点，即位置更新之间的时间比例。因此，如果您在点之间的多段线 route 有 300 个点，并且您的位置更新每 30 秒一次，您将设置一个每秒触发一次的计时器，并将标记移动到点数组的索引处(secs_since_geocode/30 * 点数). 这可以更平滑地动画化从起始标记位置到新标记位置的过渡，尽管该方法需要确保在下一个计时器事件再次移动标记之前完成。
它粗糙而丑陋，但你可以在 https://jsfiddle.net/pscott_au/1wt2o9Lw/ 看到一些有用的东西(需要等待大约 20 秒)
基本上我想要实现的是为标记提供某种在获取位置 GPS 坐标之间的转换，这通常会在某个时间间隔(比如 30 秒)进行轮询。理想情况下，您希望显示标记在这些更新之间的位置之间平滑移动。如果开车，您理想情况下希望显示沿预期行驶路径动画的标记，因此需要从路由服务获取路径。我正在使用公共(public) OSRM 服务，尽管您最好为此设置自己的后端或使用商业产品。 因此，当获得新位置时，方法是获取从上一个位置到新位置的路线，然后沿着路径向该位置前进。最近的 OSRM 版本包括一个选项，可以将结果作为经纬度点列表提供，因此无需解码编码的折线。所以只需要创建一个点队列，然后以 500 毫秒的小间隔弹出位置以移动标记。 另一个答案非常好，提供了一种进一步平滑动画的好方法。 路径是根据返回的结果构建的，如下所示:
$.ajax({
url: url,
success: function(data){
//console.log( 'Got route ' + JSON.stringify(data.route_geometry) );
// if we assume that we have 30 secs until the next geo location then we need to animate
// across this path for this duration - to demonstrate we will animate every 2 secs over 20 secs
// so to calculate the index offset we will divide the number of points in our path by 20
route_geometry = [];
// console.log( data.route_geometry );
var inc_offset = $(data.route_geometry ).size() / 20;
for (i = 0; i < 20; i++) {
console.log(i + ' x inc_offset of ' + inc_offset );
route_geometry.push( data.route_geometry[ Math.round(i*inc_offset ) ] );
}
}
});
在接下来的几天里，我将完善和清理它，然后更新这个答案。
关于javascript - 可视化实时动画移动标记，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37372973/
我的代码目前看起来像这样numbers=[1,2,3,4,5]defpop_threepop=[]3.times{pop有没有办法在一行中完成pop_three方法中的内容？我基本上想做类似numbers.slice(0,3)的事情，但要删除切片中的数组项。嗯...嗯，我想我刚刚意识到我可以试试slice! 最佳答案 是numbers.pop(3)或者numbers.shift(3)如果你想要另一边。 关于ruby-多次弹出/移动ruby数组，我们在StackOverflow上找到一
我即将开始一个将录制和编辑音频文件的项目，我正在寻找一个好的库(最好是Ruby，但会考虑Java或.NET以外的任何库)以进行实时可视化波形。有人知道我应该从哪里开始搜索吗？ 最佳答案 要流入浏览器的数据量很大。Flash或Flex图表可能是唯一能提高内存效率的解决方案。Javascript图表往往会因大型数据集而崩溃。 关于ruby-Ruby中的波形可视化，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.c
当我在我的Rails应用程序根目录中运行rakedoc:app时，API文档是使用/doc/README_FOR_APP作为主页生成的。我想向该文件添加.rdoc扩展名，以便它在GitHub上正确呈现。更好的是，我想将它移动到应用程序根目录(/README.rdoc)。有没有办法通过修改包含的rake/rdoctask任务在我的Rakefile中执行此操作？是否有某个地方可以查找可以修改的主页文件的名称？还是我必须编写一个新的Rake任务？额外的问题:Rails应用程序的两个单独文件/README和/doc/README_FOR_APP背后的逻辑是什么？为什么不只有一个？
Unity自动旋转动画1.开门需要门把手先动,门再动2.关门需要门先动,门把手再动3.中途播放过程中不可以再次进行操作觉得太复杂?查看我的文章开关门简易进阶版效果:如果这个门可以直接打开的话,就不需要放置"门把手"如果门把手还有钥匙需要旋转,那就可以把钥匙放在门把手的"门把手",理论上是可以无限套娃的可调整参数有:角度,反向,轴向,速度运行时点击Test进行测试自己写的代码比较垃圾,命名与结构比较拉,高手轻点喷,新手有类似的需求可以拿去做参考上代码usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;u
我从Ubuntu服务器上的RVM转移到rbenv。当我使用RVM时，使用bundle没有问题。转移到rbenv后，我在Jenkins的执行shell中收到“找不到命令”错误。我内爆并删除了RVM，并从~/.bashrc'中删除了所有与RVM相关的行。使用后我仍然收到此错误:rvmimploderm~/.rvm-rfrm~/.rvmrcgeminstallbundlerecho'exportPATH="$HOME/.rbenv/bin:$PATH"'>>~/.bashrcecho'eval"$(rbenvinit-)"'>>~/.bashrc.~/.bashrcrbenvversions
我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的
如何只加载map边界内的标记gmaps4rails？当然，在平移和/或缩放后加载新的。与此直接相关的是，如何获取map的当前边界和缩放级别？ 最佳答案 我是这样做的，我只在用户完成平移或缩放后替换标记，如果您需要不同的行为，请使用不同的事件监听器:在你看来(index.html.erb):{"zoom"=>15,"auto_adjust"=>false,"detect_location"=>true,"center_on_user"=>true}},false,true)%>在View的底部添加:functiongmaps4rail
我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan
如何用HAML编写这个ERB:#OR我可以:=some_ruby_code+":"#and=some_ruby_code%br但我不想在这里连接，我想将它写成内联:(=some_ruby_code):#and(=some_ruby_code)%br 最佳答案 =some_ruby_code+":"-#and=some_ruby_code+""编辑1:我不确定您在寻找什么。你想要其中之一吗？==#{some_ruby_code}:-#and==#{some_ruby_code}或==#{some_ruby_code}:-#and=so
动画/*INITIALIZEANANIMATION 初始化一个动画*-----------------------*/lv_anim_ta;lv_anim_init(&a);/*MANDATORYSETTINGS 必选设置*------------------*//*Setthe"animator"function 设置“动画”功能*/lv_anim_set_exec_cb(&a,(lv_anim_exec_xcb_t)lv_obj_set_x);/*Setthe"animator"function*/lv_anim_set_var(&a,obj);/*Lengthoftheanim