Google Map Api 3.0 – Tıklanan Alanın Koordinat ve Zoom Bilgileri
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Map Geolocation</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true"></script>
</head>
<body>
<form name="harita_formu" method="post">
<input type="hidden" name="tur" value="harita">
<table id="box-table-a">
<tbody>
<tr>
<td>Harita</td>
<td>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var Koordinatlar = new google.maps.LatLng(39.86156903970107,32.83813489062504);
var myOptions = {
zoom: 6,
center: Koordinatlar,
mapTypeId: google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
var BilgiPenceresi = new google.maps.InfoWindow(
{ content: 'www.gencayyildiz.com',
size: new google.maps.Size(50,50),
position: Koordinatlar
});
BilgiPenceresi.open(map);
var Isagretci = new google.maps.Marker({
map:map,
draggable:true,
animation: google.maps.Animation.DROP,
position: Koordinatlar,
icon: 'http://google-maps-icons.googlecode.com/files/factory.png'
});
google.maps.event.addListener(Isagretci, 'dragend', function(){
Isagretci.setAnimation(google.maps.Animation.BOUNCE);
});
google.maps.event.addListener(map, 'click', function(event){
//map.setCenter(event.latLng);
BilgiPenceresi.setPosition(event.latLng);
Isagretci.setPosition(event.latLng);
document.forms['harita_formu'].elements['harita_zoom'].value=map.getZoom();
document.forms['harita_formu'].elements['harita_geo'].value=event.latLng.lat()+","+event.latLng.lng();
});
google.maps.event.addListener(map, 'zoom_changed', function(event) {
document.forms['harita_formu'].elements['harita_zoom'].value=map.getZoom();
//document.forms['harita_formu'].elements['harita_geo'].value=event.latLng.lat()+","+event.latLng.lng();
});
}
</script>
<div id="map_canvas" style="width:605px; height: 400px; border:10px solid #e3e3ca"><script type="text/javascript">initialize()</script></div>
<input type="text" name="harita_geo" value="39.86156903970107,32.83813489062504" />
<input type="text" name="harita_zoom" value="6" />
<div class="f_kc">
<ul>
<li>Harita üzerindeki ev simgesini firmanızın bulunduğu adres üzerine yerleştiriniz. </li>
<li>Simge harita üzerinde her tıkladığınız yere gelecektir.</li>
</ul>
</div>
</td>
</tr>
<tr>
<td>Adres Bilginiz</td>
<td><text type="text" class="text" style="width:605px;">HÜRRİYET MH. 1744 SK. ŞENZEYBEK APT. NO:1 KAT:1 MERSİN</text></td>
</tr>
<tr>
<td></td>
<td><input type="button" class="genel buton buton2" value="Kaydet" onclick="DugmeleriKitle(); submit();" /></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
Merhaba hocam acaba pLACE auto complete eklentisini( yani input a şehri yazdığımızdada işaretleye bilme) yi nasıl birleştire biliriz ?
Merhaba Erdinc Bey,
Bu işlev hakkında benimde bilgim bulunmamaktadır.Araştırmaya koyulup en kısa zamanda sizleri neticeden haberdar edeceğim.
Selamün aleyküm ,
verdiğin kodu , normal html kaydedip çift tıklayıp açtığımda çalışıyor fakat localhostta html açtığımda çalışmıyor. haliyle sunucuda da çalışmıyor. ve bu
“””” Bu sayfa Google Haritalar’ı düzgün şekilde yükleyemedi. Teknik ayrıntılar için JavaScript konsoluna bakın. “”” hatayı veriyor.. aradım key alınması gerek olduğunu gördüm aldım girdim lakin yine aynı.. bilgi var mıdır?
Aleyküm Selam,
Localhostta html açmaktan kastınız nedir? Anlayamadım.
Merhaba,
Google haritalara c# dan bir baglantı ile yeni harita nasıl tanımlayıp onu çekebilirim acaba ?
Bu sayfa Google Haritalar’ı doğru şekilde yükleyemedi.
Gibi bir hata alıyorum. Artık çalışmıyor mu? api key almak zorunlu hale geldimi?
Api key almak ücretli mi
Merhaba,
İlgili içerik 2012 yılındaki API’lar üzerine oluşturulmuştur. Süreçte bir daha hiç kullanmasamda Google API’ları değişmiştir ve bildiğim kadarıyla ücretli olmuştur.
Yinede size araştırmanızı öneririm.
Kolay gelsin…
İyi günler hocam. Hocam ben yapılan bu işlemi Asp.Net Core MVC’ de yapmak istiyorum. Sizin verdiğiniz bu örneye bakaraktan konumun enlem ve boylam değerlerini ayrı ayrı şekilde aldım ve haritada her hangi bir konumu seçtiğimde konumları direk gösteriyor tek sıkıntım bu değerleri eklediğim zaman boş bir şekilde ekliyor. Konumun veri tipini string ve decimal olarak denedim ama yine aynı şekilde oldu. Yardımcı olursanız çok sevinirim. Şimdiden teşekkürler