ok muchas garcias por sus respuesta me sirvieron de mucho
ahora ando con intentar que en un click se pueda hacer una circulo y al mismo tiempo colocalr sus grados y sus lat y long en la pantalla pero hasta ahora solo me sale que cuando de el clik lo hacer pero los datos aun no alguien me puede ayudar este es mi codigo
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Google Maps</title>
<style type ="text/css">
#map_canvas{
height:600px;
width:1350px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var marker, myCircle, map;
function initialize() {
var myLatlng = new google.maps.LatLng(19.543937,-99.190802);
var mapOptions = {
zoom: 12,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map_canva s'),
mapOptions);
google.maps.event.addListener(map, 'click', function (event) {
addMarker(event.latLng);
});
}
function addMarker(latLng) {
//clear the previous marker and circle.
if (marker != null) {
marker.setMap(null);
myCircle.setMap(null);
}
marker = new google.maps.Marker({
position: latLng,
map: map,
draggable: true
});
//circle options.
var circleOptions = {
strokeColor: '#00786c',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#00786c',
fillOpacity: 0.35,
map: map,
center: latLng,
radius: 3000
};
//create circle
myCircle = new google.maps.Circle(circleOptions);
//when marker has completed the drag event
//recenter the circle on the marker.
google.maps.event.addListener(marker, 'dragend', function () {
myCircle.setCenter(this.position);
});
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>
</body>
</html>