我有以下代码，但效果不错，但只有一个问题。我有一个车辆列表，我希望它将地图中心到我点击的车辆的位置。问题是，当我点击超过2辆车时，差异会保留以前车辆的信息，并将地图置于我点击的2辆或更多车辆的中心位置。我想要的是仅显示最新的点击并忽略之前的所有点击。我尝试了几种但失败了。我该如何解决？感谢。
//Creation de Map
// ------------------
// Enable the visual refresh
google.maps.visualRefresh = true;
// Variables globales
var map = null;
var Table_Pins = {}; // Liste des Pins affichées
var Pos_Info = null; // Dit sur quel marker se situe l'infobulle
var Liste_Points = []; // Pour la mémorisation du tracé
var route = null;
var markers = [];
var _this = this;
//-----------------------------------------------------------------
function initialize()
{
var mapOptions = {
zoom: 12,
center: new google.maps.LatLng(43.665, 7.052),
mapTypeId: google.maps.MapTypeId.ROADMAP, //Type de carte
mapTypeControl: true,
panControl: true,
zoomControl: true, //Zoom
scaleControl: true, //Echelle
scaleControlOptions: {
position: google.maps.ControlPosition.LEFT_BOTTOM},
streetViewControl: true
} ;
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}
//------------------------
// Ouverture du WebBrowser
// -----------------------
try { google.maps.event.addDomListener(window, 'load', initialize);}
catch (ex){ alert("vous devez etre connecte a l'internet...");}
// ------------------------------------------------------------------------------------
//*************************************************************************************
// Affichage des véhicules
//*************************************************************************************
// ------------------------------------------------------------------------------------
var infowindows=[];
var title_markers=[];
var openedInfoWindow = null;
var infowindow;
var title_marker;
var TraceBounds = new google.maps.LatLngBounds();
var MarkerBounds = new google.maps.LatLngBounds();
function Affiche_Pin(Lat, Long, immat, type, site, vitesse, date)
{ var myPin = Table_Pins[immat];
if (typeof myPin != "undefined")
{
myPin.setPosition(new google.maps.LatLng(Lat, Long));
myPin.html = '<b style="color:green">Véhicule : ' + immat + ' ' + '</b><br>' +
'Site : ' + site + '<br>' +
'Type : ' + type + '<br>' +
'Vitesse : ' + vitesse + ' km/h' + '<br>' +
'Date : ' + date + '<br>';
if (Pos_Info == myPin)
{ infowindow.setContent(myPin.html);
infowindow.open(map, marker); }
}
// -------------------------------
// Création de la Pin et placement
// -------------------------------
else{
var imageMarqueur = new google.maps.MarkerImage('http://maps.google.com/mapfiles/kml/pal4/icon15.png',
new google.maps.Size(32, 32),
new google.maps.Point(0,0),
new google.maps.Point(16, 32));
var ombreMarqueur = new google.maps.MarkerImage('http://maps.google.com/mapfiles/kml/pal4/icon15s.png',
new google.maps.Size(56, 32),
new google.maps.Point(0,0),
new google.maps.Point(16, 32));
var vehlatlng = new google.maps.LatLng(Lat, Long) ;
var marker = new google.maps.Marker({
map: map,
position: vehlatlng,
icon: imageMarqueur,
shadow: ombreMarqueur });
marker.html = '<b style="color:green">Véhicule : ' + immat + ' ' + '</b><br>' +
'Site : ' + site + '<br>' +
'Type : ' + type + '<br>' +
'Vitesse : ' + vitesse + ' km/h' + '<br>' +
'Date : ' + date + '<br>';
marker.tooltip_html = '<b style="color:green">Véhicule : ' + immat + ' ' + '</b>';
infowindow = new google.maps.InfoWindow({
content: marker.html,
position: vehlatlng });
title_marker = new google.maps.InfoWindow({
content: marker.tooltip_html,
position: vehlatlng });
markers.push(marker);
MarkerBounds.extend(marker.position);
infowindows.push(infowindow);
title_markers.push(title_marker);
marker.setMap(map);
// Evenement "Click" et "infowindowopen" du marker
// ---------------------------
google.maps.event.addListener(marker, 'click', function() {
if (openedInfoWindow != null) openedInfoWindow.close(); // <-- changed this
infowindow.setContent(marker.html);
infowindow.open(map, marker);
Pos_Info = marker;
// added next 4 lines
openedInfoWindow = infowindow;
google.maps.event.addListener(infowindow, 'closeclick', function() {
openedInfoWindow = null;
});
});
// Marker show tooltip
//------------------------------------------------------------------------
google.maps.event.addListener(marker, 'mouseover', function() {
title_marker.setContent(marker.tooltip_html);
title_marker.open(map, marker);
});
// Marker hide tooltip
//------------------------------------------------------------------------
google.maps.event.addListener(marker, 'mouseout', function() {
title_marker.close();
});
Table_Pins[immat] = marker;
}//end else
}//end function affiche_pin
// ------------------------------------------------------------------------------------
//**************************************************************************************
// On centre le véhicule
//**************************************************************************************
// ------------------------------------------------------------------------------------
var myPin;
function Centrer_Pin(immat) {
myPin = Table_Pins[immat];
if (typeof myPin != "undefined")
{ //var myPins = myPin;
infowindow.close();
map.setZoom(13);
map.setCenter(myPin.getPosition());
infowindow.setContent(myPin.html);
infowindow.open(map, myPin);
//Position changed ---------------------
google.maps.event.addListener(myPin, 'position_changed', function() {
map.panTo(myPin.getPosition());
if (openedInfoWindow != null) openedInfoWindow.close(); // <-- changed this
infowindow.setContent(myPin.html);
infowindow.open(map, myPin);
openedInfoWindow = infowindow;
google.maps.event.addListener(infowindow, 'closeclick', function() {
openedInfoWindow = null;
});
alert("bomb bomb");
});
//Zoom changed -------------------------
google.maps.event.addListener(map, 'zoom_changed', function() {
infowindow.close();});
}
}
答案 0 :(得分：0)
由于每次点击标记都会调用Centrer_Pin，你必须从那里删除以下的监听器
google.maps.event.addListener(myPin, 'position_changed', function() {..
并将其放在其他地方，您只需为每个标记调用一次。应该创建Table_Pins[immat]
您现在正在做的是为同一个标记添加多个侦听器，这就是您提到的那种弹跳的原因。你添加的每个听众都被调用。这就是为什么它适用于第一次点击，之后一切都出错了。