Поиск по карте Google по адресу

0

как я могу искать по местоположению (адресу).

Я хочу передать местоположение на свою карту. Теперь я добавил lat, long. Или есть быстрый способ узнать lat и long с javascript?

 var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng(40.0000, -98.0000), Here I want to just add the location for example Dublin, Ireland
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }

http://jsfiddle.net/pc7Uu/346

Спасибо за вашу помощь.

Лучший

Теги:
google-maps
dom

4 ответа

0
Лучший ответ

Он называется Geocoding, он на самом деле очень прост в использовании, для начала работы ознакомьтесь с API геокодирования Google Maps, так как вы используете JavaScript, вам не нужен API_KEY, чтобы вы могли фактически конвертировать адреса в значения lat/lng с помощью запросов, таких как это:

https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA

Вы получите JSON с координатами внутри ключа "location", например:

...
"location" : {
    "lat" : 37.4220352,
    "lng" : -122.0841244
},
...

Изменения от V2 до V3 (рекомендуется). Вот обе документации, если вы хотите использовать определенную версию:

API V3: http://code.google.com/apis/maps/documentation/geocoding/

API V2: http://code.google.com/apis/maps/documentation/services.html#Geocoding

Если вы хотите использовать функции автозаполнения и/или имя сайта для координат lat/lng, проверьте пример поиска места в Autocomplete.

Поделиться
  • 0
    Как я могу получить доступ к объектам json? Я пробовал $ .getJSON (' maps.googleapis.com/maps/api/geocode/… ', function (data) {console.log ('aasdfasfasfsdf' + data.geometry);});
0

Google Maps Geocoding API предназначен для этой цели, приведенный ниже пример показывает, как установить центр карты на основе предоставленного адреса:

//Data
var cities = [
    {
        city : 'Toronto',
        desc : 'This is the best city in the world!',
        lat : 43.7000,
        long : -79.4000
    },
    {
        city : 'New York',
        desc : 'This city is aiiiiite!',
        lat : 40.6700,
        long : -73.9400
    },
    {
        city : 'Chicago',
        desc : 'This is the second best city in the world!',
        lat : 41.8819,
        long : -87.6278
    },
    {
        city : 'Los Angeles',
        desc : 'This city is live!',
        lat : 34.0500,
        long : -118.2500
    },
    {
        city : 'Las Vegas',
        desc : 'Sin City...\'nuff said!',
        lat : 36.0800,
        long : -115.1522
    }
];

//Angular App Module and Controller
angular.module('mapsApp', [])
.controller('MapCtrl', function ($scope) {

    var mapOptions = {
        zoom: 4,
        //center: new google.maps.LatLng(40.0000, -98.0000),
        mapTypeId: google.maps.MapTypeId.TERRAIN
    }

    $scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);
    


    var setMapCenterByAddress = function(map,address) {
        var geocoder = new google.maps.Geocoder();
        if (geocoder) {
            geocoder.geocode({ 'address': address }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {

                    map.setCenter(results[0].geometry.location);
                    var marker = new google.maps.Marker({
                         map: map,
                         position: results[0].geometry.location,
                         title: address
                    });
                }
                else {
                    console.log("Geocoding failed: " + status);
                }
            });
        }
    };

    setMapCenterByAddress($scope.map,'Dublin, Ireland');

});
<script src="http://maps.googleapis.com/maps/api/js?key=&sensor=false"></script>
<script src="http://code.angularjs.org/1.2.25/angular.js"></script>
<script src="map.js"></script>
<style>
#map {
    height:420px;
    width:600px;
}
</style>
<div ng-app="mapsApp" ng-controller="MapCtrl">
    <div id="map"></div>
</div>
Поделиться
0

Я использовал этот плагин, это очень просто:

https://ubilabs.github.io/geocomplete/

альтернативное бесплатное обслуживание геопозиции в координатах, вы можете использовать openstreet map, вы можете комбинировать это с автозаполнением jquery

http://nominatim.openstreetmap.org/search/

Поделиться
0

Я думаю, что ваш настоящий код не будет делать то, что вы пытаетесь сделать.

Во-первых, вот что должен делать код на простом английском языке. Я объясню каждую часть позже.

1. Отправьте запрос в API геокодирования Google. Этот запрос будет содержать адрес, который вы пытаетесь найти в lat & lng. Вы получите ответ в виде JSON, который вы проанализируете, чтобы получить необходимую информацию.

2. Сохраните информацию (широту и долготу) в переменной

3. Создайте карту и воспользуйтесь описанной выше функцией lat & lng в качестве ее центра.

Хорошо, теперь вот источники кода. Не волнуйтесь, эти примеры кода очень просты, и вы легко поймете, что делать.

  1. Как отправить запрос "GET":

    var request = new XMLHttpRequest();
request.onreadystatechange = function() {
    if (request.readyState === 4) {
        if (request.status === 200) {
            document.body.className = 'ok';
        } else {
            document.body.className = 'error';
        }
    }
};
request.open("GET", url , true);
request.send(null);

HTTP-запрос для геокодирования: https://developers.google.com/maps/documentation/geocoding/intro#GeocodingRequests

  1. Вот как будет выглядеть код: (пример)

    var json = https://maps.googleapis.com/maps/api/geocode/json?address=1600+"ADD ADDRESS HERE"&key=YOUR_API_KEY;
var object = JSON.parse(json);

  2. Затем вы можете извлечь lat & lng из этого объекта.

  3. После этого создайте карту, используя: (link) www.developers.google.com/maps/tutorials/fundamentals/adding-a-google-map

(Используйте выделенную выше широту и долготу в качестве "центра" на карте Google, которую вы создадите)

Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню