google maps api kullanımı

Doğru Cevap

• 1
  

  11 yıl önce yazılmış

  kiirpi

  26 cevap - 0 soru
  Merhaba ,
  
  Aşağıdaki kodda bir haritayı sayfaya nasıl ekleyeceğini görebilirsin. Buradaki dinamik değerler ( noktayı ) veritabanından alarak aşağıdaki kodda gerekli yerleri değiştirerek sayfanda gösterebilirsin.
  
  Bu da google map api'nin ana sayfası ordan tüm bilgilere erişebilirsin.
  https://developers.google.com/maps/
  
  
  

  <!-- Google Harita'yı sayfamıza ekliyoruz -->
      <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
     <!-- Javascript kodumuz -->
      <script type="text/javascript"> 
          function initializeMap() {
              var gmappoint = new google.maps.LatLng(40.978333,29.121352);
              var myOptions = {
                  zoom: 16,
                  center: gmappoint,
                  mapTypeId: google.maps.MapTypeId.HYBRID
              }
              var map = new google.maps.Map(document.getElementById("divMap"), myOptions);
              // infoWindow içerisinde gösterilecek içeriği ayarlanıyor
              var contentString = "İçerik Burada ayarlanıyor";
              // infoWindow oluşturuluyor
              var infowindow = new google.maps.InfoWindow({
                  content: contentString
              });
              var gmapMarker = new google.maps.Marker({
                  position: new google.maps.LatLng(40.978333,29.121352), 
                  map: map, 
                  title:"Nokta Bilgisi"
              });
              // gmapMarker'a click event'i ekleniyor ve infowindow'un gösterilmesini
              google.maps.event.addListener(bioteknoMarker, 'click', function(event) {
                  infowindow.open(map,gmapMarker);
              });
              // info penceresinin otomatik açılması sağlar , istenmiyorsa alttaki satırı silebilirsiniz
              window.setTimeout(function(){
                  infowindow.open(map,gmapMarker);
              },500);
          }
      </script> 
  
  <!-- Google Haritanın gösterileceği div'i ekliyoruz. -->
      <div id="divMap" style="width: 500px; height: 400px"></div> 
  <!-- Son olarak sayfa yüklendiğinde haritanın yüklenmesi -->
      <script>
          function init(){
              initializeMap();
          }
          window.onload = init;
      </script>
  

  • kiirpi
    koddaki bioteknoMarker yerine gmapMarker olacak.
    11 yıl önce yazılmış
  • bensedat18
    teşekkür ederim hocam.
    11 yıl önce yazılmış
  • firatakin
    Günlerdir api key ile uğraşıyorum bir türlü çözememiştim. api key gerek olmadan gayet güzel görüntüleyebiliyormuşuz. Teşekkürler anlatım için.
    
    Marker'a tıklandığınca çıkan infoWindow'un boyutuyla nasıl oynayabiliriz ?
    11 yıl önce yazılmış
  • realturk
    nasıl haritadan seçim yapip marker yazabiliriz ?
    10 yıl önce yazılmış
  • kiirpi
    Tam olarak yapmak istediğiniz anlamadım , daha açıklayıcı yazar mısınız?
    10 yıl önce yazılmış
  • realturk
    kayıt formu düşün adam haritadan adresini işaretliyecek kordinatlarını db ye kaydedicem sonra profil sayfasına girdiği zaman harita kısmı olacak
    10 yıl önce yazılmış

Cevaplar