Google maps - отличное средство для картографии и сейчас мы будем интегрировать его себе на сайт благодаря открытому API. Интегрировать будем не только фиксированное положение но и произвольное, а именно - создадим в базе данных таблицу "locations", впишем там поля title, x, y.

Теперь нам надо редактировать каждое местоположение. Создадим полотно, где будет отображаться карта.

<div id="map" style="width: 250px; height: 250px"></div>

Дальше - прикрутим вызов библиотеки из google. Поскольку я использую smarty, то я передаю ключ разработчика в виде переменной.

<script src="http://maps.google.com/maps?file=api&key={$google_maps_hash}&v=2" type="text/javascript"></script>

Теперь сделаем функцию, которая будет заниматься всей гразной работой - создавать карту в нашем div элементе, позиционировать согласно заданным координатам, устанавливать bubble. В случае если мы редактируем эти координаты, то функция будет по обратной связи прописывать в скрытые input-поля некоей формы "registration_form" новые координаты перенесённого pin-указателя.

<script type="text/javascript">
function load_map(x,y,title) {

if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(x, y), 13);
map.enableScrollWheelZoom();

point = new GLatLng(x, y);
marker = new GMarker(point);

map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.addOverlay(marker);
marker.openInfoWindowHtml(title);
/*
var mgr = new GMarkerManager(map);

GEvent.addListener(marker, "dragend", function() {
//var center = map.getCenter();
var strCenter=marker.getPoint();
marker.openInfoWindowHtml(document.forms['registration_form'].title.value);
document.forms['registration_form'].geo_x.value=strCenter.lat();//arrCenter[0];
document.forms['registration_form'].geo_y.value=strCenter.lng();//arrCenter[1];

});
*/
}
}
</script>