如何更新Google地图中多个标记的位置
||
我正在使用Google Maps API在地图上放置标记。标记的gps坐标存储在mySQL数据库中。我已经能够创建标记，但是位置会不断变化，所以我想知道如何去更新标记的位置，以便标记在地图上移动。到目前为止，这是我的代码：
<!DOCTYPE html>
<html>
<head><title>Map</title>
<style type=\"text/css\">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
<script type=\"text/javascript\" src=\"http://maps.google.com/maps/api/js?sensor=false\">
</script>
<script type=\"text/javascript\">
function initialize() {
var latlng = new google.maps.LatLng(36.9947935, -122.0622702);
var myOptions = {
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById(\"map_canvas\"), myOptions);
var image = new google.maps.MarkerImage(\'busIcon.png\',
// The image size
new google.maps.Size(44, 46),
// The origin
new google.maps.Point(0,0),
// The anchor
new google.maps.Point(22, 23));
var shadow = new google.maps.MarkerImage(\'busIcon_shadow.png\',
new google.maps.Size(58, 46),
new google.maps.Point(0,0),
new google.maps.Point(22, 23)
);
var shape = {
coord: [1, 1, 1, 45, 43, 45, 43 , 1],
type: \'poly\'
};
var markers = [
<?php
// Make a MySQL Connection
mysql_connect(\"**********\", \"**********\", \"**********\") or die(mysql_error());
mysql_select_db(\"matsallen\") or die(mysql_error());
//Get number of rows
$result = mysql_query
(
\'SELECT COUNT(*) FROM busTrack AS count\'
)
or die(mysql_error());
$row = mysql_fetch_array( $result );
$length = $row[\"COUNT(*)\"];
for ($count = 1; $count <= $length; $count++) {
//Get data from MySQL database
$result = mysql_query
(
\'SELECT * FROM busTrack WHERE busID = \'.$count
)
or die(mysql_error());
// store the record of the \"busTrack\" table into $row
$row = mysql_fetch_array( $result );
// Echo the data into the array \'markers\'
$output = \'{id: \"Bus \'.$row[busID].\'\", lat: \'.$row[lat].\', lng: \'.$row[lon].\'}\';
if ($count != $length) {
$output = $output.\',\';
};
echo $output;
};
?>
];
for (index in markers) addMarker(map, markers[index]);
function addMarker(map, data) {
//create the markers
var marker = new google.maps.Marker({
position: new google.maps.LatLng(data.lat, data.lng),
map: map,
title: data.id,
icon: image,
shape: shape,
shadow: shadow
});
//create the info windows
var content = document.createElement(\"DIV\");
var title = document.createElement(\"DIV\");
title.innerHTML = data.id;
content.appendChild(title);
var infowindow = new google.maps.InfoWindow({
content: content
});
// Open the infowindow on marker click
google.maps.event.addListener(marker, \"click\", function() {
infowindow.open(map, marker);
});
}
}
</script>
</head>
<body onload=\"initialize()\">
<div id=\"map_canvas\" style=\"width:75%; height:75%; margin:10%; allign:center;\"></div>
</body>
</html>
没有找到相关结果
已邀请:
1 个回复
痰降锭骂奸
为此，您需要将所有标记保存在数组中。也许这样的事情会起作用：var myMarkers = new Array(); for (index in markers) { myMarker[ markers[index][\'id\'] ] = addMarker(map, markers[index]); } function addMarker(map, data) { //create the markers var marker = new google.maps.Marker({ position: new google.maps.LatLng(data.lat, data.lng), map: map, title: data.id, icon: image, shape: shape, shadow: shadow }); //create the info windows var content = document.createElement(\"DIV\"); var title = document.createElement(\"DIV\"); title.innerHTML = data.id; content.appendChild(title); var infowindow = new google.maps.InfoWindow({ content: content }); // Open the infowindow on marker click google.maps.event.addListener(marker, \"click\", function() { infowindow.open(map, marker); }); return marker; }我没有测试上面的代码，因此可能存在小的语法错误或某些错误，但是它应该可以为您提供帮助。