谷歌地图更新标记从改变mysql坐标
Google Maps update marker from changing mysql coordinate
我一直在寻找帮助,但我找到的一切都没有帮助我。
我正试图找到一个解决方案,使我能够在谷歌地图上绘制移动物体的GPS坐标。
每个对象的GPS坐标将不断更新到MySQL数据库中,我想知道是否有可能读取每个更新的坐标,也许每隔几秒钟一次,并在谷歌地图上重新绘制标记坐标,而无需用户刷新页面。这是可以做到的,还是太复杂了,使用谷歌地图的API
提前感谢。
编辑>我的当前代码。
<?php
mysql_connect("$host", "$username", "$password")or die("cannot connect");
mysql_select_db("$db_name")or die("cannot select DB");
$sql="SELECT * FROM `gps`";
$result=mysql_query($sql);
while($row = mysql_fetch_array($result))
{
$_SESSION['x']=$row['x'];
$_SESSION['y']=$row['y'];
$_SESSION['driver']=$row['driver'];
$_SESSION['callsign']=$row['username'];
}?>
<head>
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0; padding: 0 }
#map-canvas { height: 100% }
</style>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Live Viewer</title>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(<?php echo $_SESSION['x'].",".$_SESSION['y']; ?>);
var mapOptions = {
zoom: 11,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: '<?php echo $_SESSION{'']; ?>'
});
}
function movemarker( map, marker ) {
marker.setPosition( myLatlng );
map.panTo( myLatlng );
};
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
只需设置一个setInterval()
与一个匿名函数调用一个Ajax请求检索坐标。
那么就只需要更新正确的标记了。
一行的内容setInterval(function(){
jQuery.getJSON('/getmarker.php?id=1234', function(data){
updateMarker(marker, data.lat, data.lng);
});
}, 5000);
当然,你不必使用jQuery ajax的东西,但它肯定会使它更容易…
这与Google Maps API本身无关。你所要做的就是在你的站点上创建一个"类似api"的端点,返回更新后的坐标,例如JSON字符串,然后在客户端使用setTimeout
使用Ajax/XHR频繁地检索这个端点的URL。然后,您可以解析它并将其应用于Google Maps实例。
如何开发这个完全取决于你的前端和后端选择,你使用哪个JS库等等。
相关文章:
- 动态地改变“”的URL;添加新项目”;链接使用javascript/jquery
- 使用jquery将mysql数据获取到新的表行中
- 将地理编码结果转换为php变量以发布到mysql数据库
- jQuery:当屏幕大小改变时,如何更改默认图像和悬停图像
- 如何使用JS禁用表行,并在MYSQL中插入所选选项
- 从MySQL数据库中获取输入数据需要两次页面刷新
- 将一个表的id与另一个表中的user_id进行匹配,以获取mysql中的记录
- 为什么使用immutableJS我的状态没有改变
- 在php和mysql中选择选项.一旦选择了选项,就列出我的sql数据库数据
- JavaScript改变了双方的显示风格
- 改变所有<td>为特定的桌子点击颜色
- 如何使用PHP将javascript变量添加到mysql数据库中
- 变量dos'即使我可以返回更新后的值,也不会改变
- 将phonegap图像发布到php/mysql-图像字段从发布请求中消失
- 在node.js-mysql中执行UPDATE查询不起作用
- jQuery更改变量值
- 更新从Mysql查询检索到的数据?Node.js节点mysql
- 单击鼠标,用MySQL数据填充html表单输入字段
- 谷歌地图更新标记从改变mysql坐标
- 根据mysql表的值改变一行的字体颜色