将数据库中的坐标绘制到谷歌地图上,不断检查新值
我正在创建一个地图应用程序,其中设备每 10 秒向网络数据库发送一次坐标。我已经在谷歌地图上绘制了它们。但问题是我需要每 5 秒重新加载一次地图以加载传入的新坐标。为此我可以使用 setTimeout() javascript 函数。我不确定是否可以使用此查询来轮询最后插入的行。SELECT lat, lon FROM map ORDER BY id DESC LIMIT 1
('id'自动递增)。我知道可能会有更好的东西。任何帮助将不胜感激。谢谢。这是我到目前为止的代码。
<?php $db = mysql_connect("localhost","root","qwerty");
mysql_select_db("test", $db); ?>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(37.386339,-122.085823);
var myOptions = {
zoom: 13,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var WalkingPathCoordinates = [];
<?php $coordinates="SELECT * FROM map";
$Result1 = mysql_query($coordinates, $db)or die(mysql_error());
while(list($id,$lat,$long) = mysql_fetch_row($Result1))
{
echo "var latlng = new google.maps.LatLng(".$lat.",".$long.")\n";
echo "WalkingPathCoordinates.push(latlng);\n";
}
?>
var WalkingPath = new google.maps.Polyline({
path: WalkingPathCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
WalkingPath.setMap(map);
}
</script>
I am creating a map application where a device is sending coordinates to a web database every 10 seconds. I've plotted them on google maps. But the problem is I need to reload the map every 5 seconds to load the new coordinates that had come in. For this I can use the setTimeout() javascript function. I am not sure whether I can use this query to poll the last inserted row.. SELECT lat, lon FROM map ORDER BY id DESC LIMIT 1
('id' auto increments). I know there might be something better. Any help would be greatly appreciated. Thanks. This is my code so far.
<?php $db = mysql_connect("localhost","root","qwerty");
mysql_select_db("test", $db); ?>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(37.386339,-122.085823);
var myOptions = {
zoom: 13,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var WalkingPathCoordinates = [];
<?php $coordinates="SELECT * FROM map";
$Result1 = mysql_query($coordinates, $db)or die(mysql_error());
while(list($id,$lat,$long) = mysql_fetch_row($Result1))
{
echo "var latlng = new google.maps.LatLng(".$lat.",".$long.")\n";
echo "WalkingPathCoordinates.push(latlng);\n";
}
?>
var WalkingPath = new google.maps.Polyline({
path: WalkingPathCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
WalkingPath.setMap(map);
}
</script>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果您不想刷新整个地图,可以将初始化函数分成两个函数。例如,您可以有一个名为initializeMap() 的函数,它执行在页面上显示地图的部分,如下所示:
另一个函数可以称为refreshMarkers() 并执行与标记相关的操作。通过在initializeMap()函数外部声明
map
,可以从refreshMarkers()函数访问它。然后,initializeMap() 函数应该只被调用一次,而refreshMarker() 应该被发送到setTimeout(),就像您在示例中初始化一样。这样,每次超时时只会执行refreshMarker() 操作。
不幸的是,我无法对此进行测试,因此我不确定您是否还需要删除刷新标记函数中的旧标记。
让我知道这是否有帮助
If you do not want the whole map to be refreshed, you can separate your initialize function into two functions. For example, you can have one function called initializeMap() which does the part that displays the map on the page, something like this:
The other function could be called refreshMarkers() and do the stuff related to the markers. With
map
declared outside of the initializeMap() function it is accessable from the refreshMarkers() function.The initializeMap() function should then only be called once, while the refreshMarker() should be sent to setTimeout() like you did with initialize in your example. In that way, only the refreshMarker() stuff will be done on every timeout.
Unfortunately I have not had the possibility to test this, so I am not sure if you need to also erase the old markers in the refreshMarker function.
Let me know if this helps