Google maps - добавлять новые маркеры без инициализации карты каждый раз - PullRequest
Новая
       3

Google maps - добавлять новые маркеры без инициализации карты каждый раз

1 голос
/ 17 января 2012

Это то, что я хочу сделать: я прошу пользователя ввести широту + долготу в поле ввода, и я хочу показать маркер на карте для этого местоположения, без необходимости каждый раз инициализировать карту.

Я инициализировал карту следующим образом: 

<script type="text/javascript">
    jQuery(document).ready(function() {
    var myOptions = {
          center: new google.maps.LatLng(34.053228, -118.259583),
          zoom: 12,
          zoomControl: true,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    });
</script>
<div style='height: 400px;'>
    <div id="map_canvas" style="width:100%; float: left; height:100%"></div>
</div>

До сих пор нет джаза, это нормальный способ определения карты. Теперь у меня есть поле ввода, где я прошу пользователя ввести адрес: 

<input type="text" size=30 name="lat" id="lat">
<input type="text" size=30 name="lon" id="lon">
<button type="button" id="address_submit">Search</button>

Я хочу показать маркер для этого адреса. Я определил функцию, показанную ниже, но не понимаю, как показать, получить объект карты: 

    $("#address_submit").live("click", function() {
    lat = $("#lat").val();
    lon = $("#lon").val();
    var marker = new google.maps.Marker({
          position: new google.maps.LatLng(lat, lon),
          map: map, //HOW DO I GET THIS MAP OBJECT??
          title:"Hello World!"
      });
}

1 Ответ

1 голос
/ 17 января 2012

Я попробовал ваш код в jsfiddle => http://jsfiddle.net/HaDbR/, и все, кажется, работает как ожидалось (я немного уменьшил коэффициент масштабирования, чтобы увидеть вставленные маркеры): я вставил некоторые координатыв форме (рядом с координатами центра карты) и маркеры отображались правильно.

Единственное реальное отличие - это видимость переменной map, так что обработчик click, примененный к кнопке, может ее видеть,и метод .on() вместо .live()

Я вставил скрипт API googlemap, вызвав функцию обратного вызова createMap(), и в этой функции я инициализировал карту и связал обработчикТаким образом, закрытие может иметь доступ к вашей карте

...