Pazartesi, Mayıs 14, 2018

Bing Maps Kullanımı

  Hiç yorum yok

Hepinize merhaba arkadaşlar hepimizin bildiği gibi Google Maps API lerini ücretli yaptı ve artık ücretsiz destek vermiyor.

Tabi biz yazılımcılar olarak bunun bizi engellemesine izin verecek miyiz ? Hayır.
Google Maps i kullanamıyorsak bizde Bing Maps kullanırız projelerimizde.

Bu yazımda basit bir şekilde Bing Maps ile kullanıcıya konum göstermeyi anlatmaya çalışacağım.

Kodlarımıza geçelim.

Sitemizin <head></head> kısmına ekleyeceğimiz Java Scriptimiz.

<script type='text/javascript' 
            src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap' 
            async defer></script>
    <script type='text/javascript'>
    var map, searchManager;

    function GetMap() {
        map = new Microsoft.Maps.Map('#myMap', {
            credentials: "Bing Api Kodunuz"
        });

        //Make a request to geocode New York, NY.
      
    }

    function geocodeQuery(query) {
        //If search manager is not defined, load the search module.
        if (!searchManager) {
            //Create an instance of the search manager and call the geocodeQuery function again.
            Microsoft.Maps.loadModule('Microsoft.Maps.Search', function () {
                searchManager = new Microsoft.Maps.Search.SearchManager(map);
                geocodeQuery(query);
            });
        } else {
            var searchRequest = {
                where: query,
                callback: function (r) {
                    //Add the first result to the map and zoom into it.
                    if (r && r.results && r.results.length > 0) {
                        var pin = new Microsoft.Maps.Pushpin(r.results[0].location);
                        map.entities.push(pin);

                        map.setView({ bounds: r.results[0].bestView });
                    }
                },
                errorCallback: function (e) {
                    //If there is an error, alert the user about it.
                    alert("No results found.");
                }
            };

            //Make the geocode request.
            searchManager.geocode(searchRequest);
        }
    }
    </script>


Sitemizde haritanın görünmesini istediğimiz yere ekleyeceğimiz kod.

<div id="myMap" style="position:relative;width:600px;height:400px;"></div>

Sitemize bu kodları eklediğimiz zaman direkt olarak çalışmayacaktır.
Bing Api den erişim almanız gerekiyor. Bunun için buraya tıklayın ve kendi Bing Api Erişim kodunuzu alın.
Kendi kodunuzu aldıktan sonra Bing Api kodunuz yazan kısma kodu ekleyin ve sorunsuz bir şekilde çalışsın.

Api kodunuz un nerede olduğunu bulamadıysanız.

MyAccount -> Keys

Kısmına bakın.


Eğer dediklerimi sorunsuz bir şekilde yaparsanız aşağıdaki gibi bir sonu alacaksınız.


Önce kullanıcı izni isteyecektir. Onay verildikten sonra konumuzu görebileceksiniz.




Eğer bu yazıyı beğendiyseniz aşağıdaki butonlar ile paylaşabilirsiniz.

Hiç yorum yok :

Yorum Gönder