Показать несколько маркеров на карте Google, указав адрес - PullRequest
Новая
       26

Показать несколько маркеров на карте Google, указав адрес

0 голосов
/ 01 ноября 2010

У меня есть следующий скрипт для использования API карт Google, мне нужно создать карту, которая имеет более одного маркера (значок в форме шарика, указывающий на что-то), и мне нужно, чтобы каждый из этих маркеров указывал на другую область карта (то есть разные координаты), как я могу это сделать? ПРИМЕЧАНИЕ. У меня нет широты и долготы для области, на которой должен быть размещен маркер, вместо этого у меня есть адрес области, на которой должен быть размещен маркер.

Код для отображения нескольких маркеров на карте Google приведен ниже, но он не работает должным образом! 

var map = null;
var geocoder = null;

function initializeNew() {
    var allAddress = document.getElementById("HiddenField1").value;
    var testary = new Array();
    testary = allAddress.split("|");

       if (GBrowserIsCompatible()) {
       //calls map to appear inside <div> with id, "map_canvas"
       map = new GMap2(document.getElementById("map_canvas"));

       //adds zoom and arrow controls to map
       //map.addControl(new GSmallMapControl());

       var marker = null;
       var i = 0;
       for (i = 0; i < testary.length; i++) {

           address = testary[i];

           geocoder = new GClientGeocoder();


           //converts a street address into geocode for the api 
           geocoder.getLatLng(
          address,
          function(point) {
              if (!point) {
                  alert(address + " not found");
              } else {
                  map.setCenter(point, 13);
                  marker = new GMarker(point);
                  map.addOverlay(marker);

                  map.setMapType(G_HYBRID_MAP);

                  //adds your own marker title and description in html
                  marker.openInfoWindowHtml("<p class='para1bold' style=\"font-weight: bold;\">Address</p><p class='para1'>" + address + "</p>");
                  //Add click event on push pin to open info window on click of the icon
                  GEvent.addListener(marker, "click", function() {
                  marker.openInfoWindowHtml("<p class='para1bold' style=\"font-weight: bold;\">Address</p><p class='para1'>" + address + "</p>");
              });
                  //Provides map,satellite,hybrid and terrain views in the map along with zoom control
                  map.setUIToDefault();
              }
          }
    )
      }


  }  
}

Я сохранил адрес группы элементов в массиве и зациклен для отображения маркеров на карте. Отображает только один маркер для последнего адреса, присутствующего в массиве. Исправьте этот код или предоставьте новый код для отображения нескольких маркеров на карте Google, указав адрес.

Ответы [ 2 ]

0 голосов
/ 01 ноября 2010

Я столкнулся с точно такой же проблемой и исправил ее .Посмотрите на код, который я использовал.Особые биты в том, что маркер должен быть массивом, и когда вы открываете информационное окно, контент должен быть сохранен в массиве маркеров.Я бы также посоветовал вам использовать что-то в формате JSON, которое легче анализировать, а не разделять символом '|'.

0 голосов
/ 01 ноября 2010

попробуйте это: поставьте var перед маркером 

else {
              map.setCenter(point, 13);
              var marker = new GMarker(point);
              map.addOverlay(marker);

              map.setMapType(G_HYBRID_MAP);

              //adds your own marker title and description in html
              marker.openInfoWindowHtml("<p class='para1bold' style=\"font-weight: bold;\">Address</p><p class='para1'>" + address + "</p>");
              //Add click event on push pin to open info window on click of the icon
              GEvent.addListener(marker, "click", function() {
              marker.openInfoWindowHtml("<p class='para1bold' style=\"font-weight: bold;\">Address</p><p class='para1'>" + address + "</p>");
          });

ОБНОВЛЕНИЕ 

var geocoder = new GClientGeocoder();

var addresses = ["new york","chicago"];
var curIndex = 0;

function showAddress() {
  var _cur = addresses[curIndex];
  geocoder.getLatLng(
    _cur,
    function(point) {
      if (!point) {
        alert(_cur + " not found");
      } else {
        console.log(_cur+":"+point);
      }
      //do next after done
      curIndex++;
      if(curIndex<addresses.length)
        showAddress();
    }
  );
}

showAddress();
</script>
...