这是我第一次在这里发帖，我总是在阅读很棒的解决方案。我已经陷入困境，而且我不太确定我是否会走正路。
基本上我想在谷歌地图上显示一些汽车的位置，现在我通过另一个程序获取GPS信息，数据正在更新到MS Access数据库。我要求页面每隔10秒刷新一次标记，每5分钟刷新一次流量数据。
P.S。我知道MS Access数据库是老套的，这是另一个应该很快改变的故事！
这是我更新的页面代码： -
<!DOCTYPE html>
<html>
<%
'declare the variable that will hold new connection object
Dim Connection
'create an ADO connection object
Set Connection=Server.CreateObject("ADODB.Connection")
'declare the variable that will hold the connection string
Dim ConnectionString
'define connection string, specify database driver and location of the database
ConnectionString="PROVIDER=Microsoft.Jet.OLEDB.4.0;" & "Data Source= c:\easybook\tables.mdb"
'open the connection to the database
Connection.Mode=adModeRead
Connection.Open ConnectionString
%>
<head>
<title>Live Map Display</title>
<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
<link href="assets/css/ticketstyle.css" media="all" rel="stylesheet" type="text/css" />
<script src="assets/js/jquery.min.js"></script>
<script src="http://maps.google.com/maps/api/js" type="text/javascript"></script>
<script>
var map;
var mapMarkers = []; // Array is declared and initialized here
function initialize() {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 14,
panControl: false,
zoomControl: false,
mapTypeControl: false,
streetViewControl: false,
overviewMapControl: false,
center: new google.maps.LatLng(53.39659541993,-2.54446649561),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
var auto_remove = true;
/*window.setInterval(function() {loadMarkers()}, 1000); // refreshes every 10 seconds*/
};
function loadMarkers () {
for (var i = 0; i < mapMarkers.length; i++) {
mapMarkers[i].setMap(null); // removes marker from the map
}
mapMarkers = []; // reinitialize the array
var markers = document.getElementsByTagName("car");
for (var i = 0; i < markers.length; i++) {
location = {
label : markers[i].getAttribute("label"),
icon : markers[i].getAttribute("image"),
labelClass: "labels", // the CSS class for the label
pointlat : parseFloat(markers[i].getAttribute("lat")),
pointlng : parseFloat(markers[i].getAttribute("lng"))
};
console.log(location);
mapMarkers.push(new google.maps.Marker({
position: new google.maps.LatLng(location.pointlat, location.pointlng),
map: map,
labelClass: "label", // the CSS class for the label
label : markers[i].getAttribute("label"),
icon : markers[i].getAttribute("image"),
})
);
}
document.getElementById('car');
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<script src="http://ajax.googleapis.com/ajax/
libs/jquery/1.3.0/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<%
'declare the variable that will hold our new object
Dim Recordset
'create an ADO recordset object
Set Recordset=Server.CreateObject("ADODB.Recordset")
'declare the variable that will hold the SQL statement
Dim SQL
SQL="SELECT * FROM cartable WHERE stat>0"
Dim carno, stat, Lat, Lng
'Open the recordset object executing the SQL statement and return records
Recordset.Open SQL, Connection
%><%
'first of all determine whether there are any records
If Recordset.EOF Then
Response.Write("")
Else
'if there are records then loop through the fields
%>
<div id="header">
<div id="header-left">
<h1>MapLive</h1>
</div>
<div id="header-right">
</div>
</div>
<div id="main">
<cars>
<%Do While NOT Recordset.Eof %>
<car lng='<%Response.write Recordset("long")%>' lat='<%Response.write Recordset("lat")%>' label='<%Response.write Recordset("carno")%>' image='assets/images/loc-stat<%Response.write Recordset("stat")%>.png'/>
<%Recordset.MoveNext
Loop
End If
%>
</cars>
<div id="map"></div>
</div>
</body>
<%
Recordset.Close
Set Recordset=Nothing
Connection.Close
Set Connection=Nothing
%>
</html>
希望有人可以解释一下，我如何刷新标记，一直在挠头，我看到的其他示例编码方式不同，我猜这是Google Maps API v3。
感谢您提前的时间......
迪安
答案 0 :(得分：0)
最简单的方法是全局引用数组中的标记，然后将.push(new google.maps.Marker({...})引用到数组中。然后，您需要在页面上运行通过数组的计时器，并将标记映射设置为null，以通过setMap(null)将其从地图中删除。
var map;
var mapMarkers = []; // Array is declared and initialized here
function initialize() {
map = new google.maps.Map(document.getElementById('map'), {
zoom: 14,
panControl: false,
zoomControl: false,
mapTypeControl: false,
streetViewControl: false,
overviewMapControl: false,
center: new google.maps.LatLng(53.39659541993,-2.54446649561),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
var auto_remove = true;
window.setInterval(function() {loadMarkers()}, 10000); // refreshes every 10 seconds
};
function loadMarkers () {
for (var i = 0; i < mapMarkers.length; i++) {
mapMarkers[i].setMap(null); // removes marker from the map
}
mapMarkers = []; // reinitialize the array
var image = {
size: new google.maps.Size(16, 26),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(8, 26)
}; // this isn't being used?
var markers = document.getElementsByTagName("car");
for (var i = 0; i < markers.length; i++) {
location = {
label : markers[i].getAttribute("label"),
icon : markers[i].getAttribute("image"),
labelClass: "labels", // the CSS class for the label
pointlat : parseFloat(markers[i].getAttribute("lat")),
pointlng : parseFloat(markers[i].getAttribute("lng"))
};
console.log(location);
mapMarkers.push(new google.maps.Marker({
position: new google.maps.LatLng(location.pointlat, location.pointlng),
map: map,
labelClass: "label", // the CSS class for the label
label : markers[i].getAttribute("label"),
icon : markers[i].getAttribute("image"),
});
);
}
document.getElementById('car').addEventListener('100', cars);
};
google.maps.event.addDomListener(window, 'load', initialize);