iletişim sayfasında yol tarif navigasyonu nasıl eklenir?

+1 oy
21 Nisan 2015 Ferhat KOCABAŞ Stajyer (650 puan)   sordu
Üzerinde çalıştığım bir web projesinin iletişim sayfasına yakışıklı bir görünüm vermesi için bir yol tarif navigasyonu entegre etmek istiyorum (örn: http://www.wissenakademie.com/iletisim  gibi) Tecrübe ve önerilerinizden yararlanmak isterim..

3 Cevap

+2 oy
8 Mayıs 2015 emreb Stajyer (880 puan)   cevapladı
8 Mayıs 2015 Ferhat KOCABAŞ seçti
 
En İyi Cevap

HTML 5'le birlikte gelen geolocationGoogle Maps API ve JavaScript kullanarak rahatlıkla ekleyebilirsin. Birkaç önemli nokta var.

  • latlng objesini tanımlarken kullandığımız latitude ve longtitude değerlerini Google Maps'ten bakıp yazıyoruz.
  • mapTypeID'de ROADMAP sabitini kullandım fakat isterseniz diğer üç farklı sabiti de kullanabilirsiniz. HYBRID, SATELLITE ve TERRAIN. Buradaki HYBRID sabiti haritamızı fotoğrafik, yol haritalarını ve ve şehir isimleriyle birlikte gösterir. SATELLITE ise yalnızca fotoğrafik şekilde gösterir. TERRAIN ise topolojik harita şeklinde gösterir. (Kaynak: http://www.w3schools.com/googleAPI/ref_maptypeid.asp)
  • marker'ı da unutmayalım ki, baloncuğumuz çıksın.

 

<head>
        <meta charset="utf-8" />
        <link href="style/iletisim.css" rel="stylesheet" />
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true">

        </script>    
        <script type="text/javascript">
            function init() {
                var latlng = new google.maps.LatLng(latitude, longtitude);
                var mapOptions = {
                    zoom: 15,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("map"), mapOptions);
                var marker = new google.maps.Marker({
                    position: latlng,
                    map: map,
                    title: "Baloncukta çıkması istenen string dizisi."
                })
            }
        </script>
    </head>
<body onload="init()">
    <div id="map" style="width: 500px; height: 200px; float:right">

<!--

 

-->

</body>

0 oy
21 Nisan 2015 Tahsin Dalman Uzman (7,000 puan)   cevapladı

Google maps kullanman lazım. Temel düzeyde ingilizce bilgin varsa şu adresi incele detaylı anlatılmış.

+1 oy
23 Nisan 2015 molcay Kıdemli Uzman (12,350 puan)   cevapladı

https://support.google.com/maps/answer/3544418?hl=tr

Bu adreste anlatılmış ama sol üstteki menü simgesi değilde sağ alttaki ayarlar simgesini kullanman gerek. Sanırsam döküman biraz eski.(Bana da az önce lazım oldu bu adreste anlatıldığı gibi yaptım oldu)

...