仅在最后一个地图上显示附近搜索的标记

问题描述:

我正在显示彼此之下的几张地图。首先,我在每个地图上都有一个代码,这个代码变得非常大,所以我试图减少我的代码。 但是,我似乎无法得到这最后的工作。 Google附近的搜索结果始终显示在最后的地图上。有没有一种方法可以在createmarker函数中设置地图,以便将标记设置为适当的地图(地图[i])? 我曾尝试将所有地图存储在MarkersArray中,但无法正常工作。谢谢!仅在最后一个地图上显示附近搜索的标记

var map; 
     var infoWindow; 
     var service; 
     var request; 
     var i; 

     function initialize() 
     { 
      for (i = 2; i < locations.length-2; i++) { 
       var MapCenter = new google.maps.LatLng(locations[i][1],locations[i][2]); //CENTRE MAP: N/S, E(lower)/W 
       MyOptions = 
       { 
        zoom: 12, 
        center: MapCenter, 
        disableDefaultUI:true, 
        scrollwheel:false 
       }; 
       map = new google.maps.Map(document.getElementById('map'+i), MyOptions); 
       var weatherLayer = new google.maps.weather.WeatherLayer({ 
       temperatureUnits: google.maps.weather.TemperatureUnit.Celsius     }); 
       weatherLayer.setMap(map); 
       var cloudLayer = new google.maps.weather.CloudLayer(); 
       cloudLayer.setMap(map); 
       infoWindow = new google.maps.InfoWindow(); 
       service = new google.maps.places.PlacesService(map); 
       request = { 
        location: MapCenter, 
        radius: 10000, 
        types: ['airport','shopping_mall','subway_station','train_station','museum','place_of_worship','zoo','city_hall','local_government_office'] 
       }; 
       service.nearbySearch(request, callback); 
      }; 
     }; 

     function callback(results, status) { 
      if (status != google.maps.places.PlacesServiceStatus.OK) { 
       alert(status); 
       return; 
      } 
      for (var j = 0, result; result = results[j]; j++) { 
       createMarker(result); 
      } 
     }; 

     function createMarker(place) { 
      var gpmarker = new google.maps.MarkerImage(place.icon, null, null, null, new google.maps.Size(place.rating*5, place.rating*5)); 
      var marker  = new google.maps.Marker({ 
       map: map, 
       position: place.geometry.location, 
       title: place.name, 
       icon: gpmarker 
      }); 
      google.maps.event.addListener(marker, 'click', function() { 
       service.getDetails(place, function(result, status) { 
        if (status != google.maps.places.PlacesServiceStatus.OK) { 
         alert(status); 
         return; 
        } 
        infoWindow.setContent(result.name); 
        infoWindow.open(map, marker); 
       }); 
      }); 
     }; 

     google.maps.event.addDomListener(window, 'load', initialize); 

目前要覆盖变量mapinfoWindow & service内循环,在结束所有变量将在最后一次迭代中分配的值。

保持不变的变量(例如,通过让他们“私”通过函数),并通过这些变量作为自变量,以callback()createMarker()

function initialize() { 

     for (i = 2; i < locations.length - 2; i++) { 
      (function (i) { 
       var MapCenter = new google.maps.LatLng(locations[i][1], locations[i][2]), 
        MyOptions = { 
         zoom: 12, 
         center: MapCenter, 
         disableDefaultUI: true, 
         scrollwheel: false 
         }, 
        map = new google.maps.Map(document.getElementById('map' + i), MyOptions), 
        weatherLayer = new google.maps.weather.WeatherLayer({ 
         temperatureUnits: google.maps.weather.TemperatureUnit.Celsius, 
         map: map 
         }), 
        cloudLayer = new google.maps.weather.CloudLayer(), 
        infoWindow = new google.maps.InfoWindow(), 
        service = new google.maps.places.PlacesService(map), 
        request = { 
         location: MapCenter, 
         radius: 10000, 
         types: ['airport', 
          'shopping_mall', 
          'subway_station', 
          'train_station', 
          'museum', 
          'place_of_worship', 
          'zoo', 'city_hall', 
          'local_government_office' 
         ] 
        }; 
       cloudLayer.setMap(map); 
       service.nearbySearch(request, function (results, status) { 
        callback(results, status, map, infoWindow, service) 
       }); 
      }(i)) 

     }; 
    }; 

    function callback(results, status, map, infoWindow, service) { 
     if (status != google.maps.places.PlacesServiceStatus.OK) { 
      alert(status); 
      return; 
     } 
     for (var j = 0, result; result = results[j]; j++) { 
      createMarker(result, map, infoWindow, service); 
     } 
    }; 

    function createMarker(place, map, infoWindow, service) { 
     //your current code may stay as it is 
    }; 

    google.maps.event.addDomListener(window, 'load', initialize); 
+0

谢谢!奇迹般有效 :) – RobB 2015-02-07 20:02:28