Hi,
Here is a copy of the code I have been working on. I still have a problem when I release the marker. It does not jump.
I also still need to know how to submit the latitude and longitude into the DB.
Thanks for the support...
<!-- Google maps (create + edit markers) -->
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAYWVprCLmLlLyu9Pr6u9XZBT2yXp_ZAY8_ufC3CFXhHIE1NvwkxQX87GFVbk-BkgxiiREH_unTJNQfg" type="text/javascript"></script>
<!-- Google maps (create + edit markers) -->
<script type="text/javascript">
//<![CDATA[
// global variables
var marker;
var map;
function centerMarker() {
marker.setPoint(new GLatLng(map.getCenter().lat(), map.getCenter().lng()))
document.getElementById('edit-field-latitude-0-value').value = marker.getPoint().lat();
document.getElementById('edit-field-longitude-0-value').value = marker.getPoint().lng();
}
function createMap(){
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map"));
map.addControl(new GLargeMapControl3D());
var center = new GLatLng(18.058477018417005,-63.0856418609619);map.setCenter(center, 13);
//map.setMapType(G_SATELLITE_MAP);
map.setMapType(G_HYBRID_MAP);
//Min-max values of the zoom
G_HYBRID_MAP.getMinimumResolution = function () { return 10 };
G_HYBRID_MAP.getMaximumResolution = function () { return 18 };
marker = new GMarker(center, {draggable: true});
GEvent.addListener( marker, "dragstart", function() {map.closeInfoWindow();});
GEvent.addListener(marker, "dragend", function() {
document.getElementById('edit-field-latitude-0-value').value = marker.getPoint().lat();
document.getElementById('edit-field-longitude-0-value').value = marker.getPoint().lng();
});
map.addOverlay(marker);
}else{
alert("Sorry, the Google Maps API is not compatible with this browser");
}
}
//]]>
</script>
Also add
<body onLoad="createMap()" >
Call the map using:
<div id="map" class="gmapedit"></div>
And modify the css file by adding:
.gmapedit
{
width: 100%;
height: 450px;
float: left;
margin-bottom: 5px;
margin-top: 5px;
#margin-top: 15px;
}