<!DOCTYPE html>
<html>
<head>
<title>Geolocalizacion</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
</head>
<body>
<div id="area-google">
<div><h2>Pide jala permisos de hubicacion por google api</h2></div>
<div><button id="pedirgoogle">Pedir permisos geolocalizacion google</button></div>
<div>por api</div>
<div id="alat"></div>
<div id="alon"></div>
<div id="gres"></div>
</div>
</body>
<script>
$(document).ready(function () {
//Al hacer click en el boton
$("#pedirgoogle").click(function () {
$.ajax({
type: 'POST',
data: '',
url: "https://www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyCbj3Nos4pXqskQ01cznbJ6BeDQ3q7v_9w",
success: function (result) {
$('#alat').html(result['location']['lat']);
$('#alon').html(result['location']['lng']);
//$('#gres').html(JSON.stringify(result));
},
error: function (xhr, ajaxOptions, thrownError) {
window.alert("error");
}
});
});
</script>
</html>
