Site icon Netopsiyon Online

Geolocation API Örnek

HTML5 ile gelen özelliklerden Geolocation API kullanımına ait örnek kodu sizlere sunuyorum. Örnekle ziyaretçilere o anda bulunduğu konum bilgisini haritada gösterebilirsiniz.

Güle güle kullanın.

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Bulunduğum Yer</title>
<style>
#haritam{height: 800px;width: 1500px;}
</style>
<script src="https://maps.google.com/maps/api/js?sensor=false&key=APIKODUNUZ"></script>
<script>
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showCurrentLocation);
} else {
alert("Geolocation API DESTEKLENMIYOR");
}

function showCurrentLocation(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var coords = new google.maps.LatLng(latitude, longitude);
var mapOptions = {
zoom: 20,
center: coords,
mapTypeControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("haritam"), mapOptions);
var marker = new google.maps.Marker({
position: coords,
map: map,
title: "BULUNDUĞUM YER"
});
}
</script>
</head>
<body>
<div id="haritam"></div>
</body>
</html>
Exit mobile version