Создание интерфейса для вставки карт Google

Question

Я пытаюсь создать сайт, на котором есть возможность добавлять карты на сайт с помощью API Google Maps. Я нашел сотни учебников и постов в блоге по внедрению карты на сайте. Но на самом деле я хочу, чтобы пользователь мог выбрать место на карте и добавить маркер. Затем получите координаты маркера и сохраните его в базе данных поиска и показа во внешнем интерфейсе. Я видел эту опцию, учитывая плагины WordPress, как маппресс. Но сейчас я пытаюсь добиться этого в codeigniter. Я не могу найти ничего, с чего можно начать. Кто-нибудь может указать на кого-то, кто скажет мне, с чего начать?

Answer 1

Это действительно просто 3-я версия API карт Google . Версии до этого были куда более сложными, и большинство учебных пособий для этих версий. Ознакомьтесь с документацией и примерами API.

Добавление маркера так же просто, как:

var marker=new google.maps.Marker({/* ... see API */});

Добавление события (например, щелчка) к маркеру так же просто, как:

var marker_click=new google.maps.event.addListener(
                       marker,
                       'click',
                       function() {/*...*/});

Звучит так, будто вам нужно событие щелчка для карты, которое вы бы перевели в латлонг, затем (а) сгенерируйте маркер на карте с помощью JS и (б) опубликуйте это на своем сервере, используя AJAX или путем сохранения значений в скрытом поле формы, которое будет отправлено после.

Обновление:

В основном из документации по API @ http://code.google.com/apis/maps/documentation/javascript/events.html:

var map;
function initialize() {
  var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
  var myOptions = {
    zoom: 4,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  google.maps.event.addListener(map, 'click', function(event) {
    placeMarker(event.latLng);
  });
}

function placeMarker(location) {
  var clickedLocation = new google.maps.LatLng(location);
  var marker = new google.maps.Marker({
      position: location, 
      map: map
  });

  map.setCenter(location);

  /*Do your processing here:
   * eg. ajax.post('addMarkerDB&lat='+location.lat+'&long='+location.long);
   */
}

Примечание: По умолчанию функции ajax.post не существует, но она может быть:)