うまく機能する次のコードがありますが、問題は 1 つだけです。車両のリストがあり、クリックした車両の位置をマップの中央に配置したいと考えています。問題は、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();});
}
}