按位置創建谷歌地圖

-2

作爲菜鳥使用谷歌JavaScript API ..我必須問它！按位置創建谷歌地圖

我試着找到一些關於它的信息，但我沒有......我知道我們可以通過long/lat和許多種類型創建地圖，但是我需要通過以下位置創建地圖：

我想點爲例：巴塞羅那的Passeig deGràcia，32

其可行的使用和指向該位置爲中心，以創建地圖？ Cecause 我還沒有的郵政編碼...或者我真的需要它來諮詢API嗎？

非常感謝！

2016-04-20 Victor Ribero Guasch

調用此URL地址爲paramater https://maps.googleapis.com/maps/api/geocode/json?address=Barcelona,+Passeig+de+gracia,+32&key=YOUR_GOOGLE_API_KEY獲得該JSON

{ 
"results" : [ 
{ 
    "address_components" : [ 
    { 
     "long_name" : "32", 
     "short_name" : "32", 
     "types" : [ "street_number" ] 
    }, 
    { 
     "long_name" : "Passeig de Gràcia", 
     "short_name" : "Passeig de Gràcia", 
     "types" : [ "route" ] 
    }, 
    { 
     "long_name" : "Barcelona", 
     "short_name" : "Barcelona", 
     "types" : [ "locality", "political" ] 
    }, 
    { 
     "long_name" : "Barcelona", 
     "short_name" : "Barcelona", 
     "types" : [ "administrative_area_level_2", "political" ] 
    }, 
    { 
     "long_name" : "Catalunya", 
     "short_name" : "CT", 
     "types" : [ "administrative_area_level_1", "political" ] 
    }, 
    { 
     "long_name" : "España", 
     "short_name" : "ES", 
     "types" : [ "country", "political" ] 
    }, 
    { 
     "long_name" : "08007", 
     "short_name" : "08007", 
     "types" : [ "postal_code" ] 
    } 
    ], 
    "formatted_address" : "Passeig de Gràcia, 32, 08007 Barcelona, Barcelona, España", 
    "geometry" : { 
    "location" : { 
     "lat" : 41.3907821, 
     "lng" : 2.1672485 
    }, 
    "location_type" : "ROOFTOP", 
    "viewport" : { 
     "northeast" : { 
     "lat" : 41.39213108029149, 
     "lng" : 2.168597480291502 
     }, 
     "southwest" : { 
     "lat" : 41.38943311970849, 
     "lng" : 2.165899519708498 
     } 
    } 
    }, 
    "place_id" : "ChIJlyIRgPKipBIRd60v8v6Vc_Y", 
    "types" : [ "street_address" ] 
}

]，「狀態」：「OK」 }

調用此功能，並設置緯度和經度與新值你可以創建一個以此位置爲中心的地圖組件。

function initMap() { 
    // Create a map object and specify the DOM element for display. 
    var map = new google.maps.Map(document.getElementById('map'), { 
     center: {lat: -34.397, lng: 150.644}, 
     scrollwheel: false, 
     zoom: 8 
    }); 
}

在HTML文件中

<div id="map"></div>

來源

2016-04-20 19:31:00

2解決方案：

1：創建一個臨時（不可見）的地圖中，爲「巴塞羅那的Passeig deGràcia，32」和使用搜索返回lat/lng創建並初始化一個新地圖。

<div id="tmpMap" style="display: none; width: 0; height: 0;"></div> 
<div id="realMap"></div> 

<script> 
var map = new google.maps.Map(document.getElementById('tmpMap'), { 
    center: {lat: 0, lng: 0}, 
    zoom: 15 
}); 
var geocoder = new google.maps.Geocoder(); 
geocoder.geocode({address: 'Barcelona, Passeig de gracia, 32'}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
    latlng = results[0].geometry.location; 
    var map = new google.maps.Map(document.getElementById('realMap'), { 
     center: results[0].geometry.location, 
     zoom: 15 
    }); 
    } else { 
    alert('Geocode was not successful for the following reason: ' + status); 
    } 
}); 
</script>

2：創建一個沒有初始位置的地圖，搜索「Barcelona，Passeig de gracia，32」並在地圖上顯示它。

<div id="map" style="display: none;"></div> 

<script> 
var map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: 0, lng: 0}, 
    zoom: 15 
}); 
var geocoder = new google.maps.Geocoder(); 
geocoder.geocode({address: 'Barcelona, Passeig de gracia, 32'}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) { 
    map.setCenter(results[0].geometry.location); 
    } else { 
    alert('Geocode was not successful for the following reason: ' + status); 
    } 
}); 
</script>

來源

2016-04-20 19:45:06 cdm

按位置創建谷歌地圖

回答

相關問題