Digitalquill

My Life and Times by Matt Houldsworth

Flower

Posts Tagged ‘api’

Allowing users to add markers on maps with Google Maps API

I have been working with Google Maps API to develop various things, so when a friends band asked for some help with an idea that involved allowinging visitors to their site to place markers on a map, I came up with this code:

<script type=”text/javascript”>
//<![CDATA[

var map = new GMap(document.getElementById("map"));
map.centerAndZoom(new GPoint(10.107421875,49.89463439573421), 14);
map.addControl(new GSmallMapControl());
map.addControl(new GScaleControl());
GEvent.addListener(map, 'click', function(overlay, point) {

if (overlay) {
map.removeOverlay(overlay);
}

else if (point) {
map.recenterOrPanToLatLng(point);
var marker = new GMarker(point);
map.addOverlay(marker);
}

});

// Recenter Map and add Coords by clicking the map
GEvent.addListener(map, 'click', function(overlay, point) {
document.getElementById("latbox").value=point.y;
document.getElementById("lonbox").value=point.x;
});

// bind a search control to the map, suppress result list

map.addControl(new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
//]]>

</script>

<form method="POST" action="script.php">
<table>
<INPUT TYPE="hidden" ID="latbox" NAME="lat" value="" >
<INPUT TYPE="hidden" ID="lonbox" NAME="lon" value="" >
<input name="Submit" type="submit" value="Submit">
</form>

Take a look at Circus Envy Bands Traveling CD