saltun/example.html

## example.html
<!DOCTYPE html>
<html>
<head>
    <title>Google Maps Single Marker</title>
    <style type="text/css">
        #map_canvas {height:600px;width:800px}
    </style>

    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

    <script type="text/javascript">
        var map;
        var markersArray = [];

        function initMap()
        {
            var latlng = new google.maps.LatLng(41, 29);
            var myOptions = {
                zoom: 10,
                center: latlng,
                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);


                document.getElementById("latFld").value = event.latLng.lat();
                document.getElementById("lngFld").value = event.latLng.lng();
            });
        }
        function placeMarker(location) {

            deleteOverlays();

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

            markersArray.push(marker);


        }


        function deleteOverlays() {
            if (markersArray) {
                for (i in markersArray) {
                    markersArray[i].setMap(null);
                }
            markersArray.length = 0;
            }
        }
    </script>
</head>

<body onload="initMap()">
    <div id="map_canvas"></div>
    <input type="text" id="latFld">
    <input type="text" id="lngFld">
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Google Maps Single Marker</title>
	<style type="text/css">
	#map_canvas {height:600px;width:800px}
	</style>

	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

	<script type="text/javascript">
	var map;
	var markersArray = [];

	function initMap()
	{
	var latlng = new google.maps.LatLng(41, 29);
	var myOptions = {
	zoom: 10,
	center: latlng,
	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);


	document.getElementById("latFld").value = event.latLng.lat();
	document.getElementById("lngFld").value = event.latLng.lng();
	});
	}
	function placeMarker(location) {

	deleteOverlays();

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

	markersArray.push(marker);


	}


	function deleteOverlays() {
	if (markersArray) {
	for (i in markersArray) {
	markersArray[i].setMap(null);
	}
	markersArray.length = 0;
	}
	}
	</script>
	</head>

	<body onload="initMap()">
	<div id="map_canvas"></div>
	<input type="text" id="latFld">
	<input type="text" id="lngFld">
	</body>
	</html>