2017-07-17 15 views
0

私のウェブアプリケーションでは、gmap javascript API(https://developers.google.com/maps/documentation/javascript/)を使用しています。私は、ユーザーがボタンを押した後、gmapを配置/中央に配置するための関数の中で以下のコードを使用しています。Google Maps API - キーワード(都市名)で位置/センター

var position = new google.maps.LatLng(lat, lng); 
map.setCenter(position); 

このコードでは、緯度と経度を使用しています。緯度と経度の代わりに、私は与えられたキーワードに基づいてgmapを配置/中心化したいと思います。たとえば、入力が「パリ」の場合、どのようにgmapを配置/中心に配置できますか?

+0

を見てください/ start)必要な都市の緯度/経度を取得する –

答えて

0

Maps JavaScript APIのジオコーダーサービスを使用して、入力(たとえばパリ)を解決してマップを調整し、中心に合わせることができます。

は、次のコードサンプルに[GoogleマップのジオコーディングAPI](https://developers.google.com/maps/documentation/geocodingを使用することができます

var map; 
 
function initMap() { 
 
    var geocoder = new google.maps.Geocoder(); 
 

 
    map = new google.maps.Map(document.getElementById('map'), { 
 
    center: {lat: 0, lng: 0}, 
 
    zoom: 8 
 
    }); 
 

 
    geocoder.geocode({'address': "Paris"}, function(results, status) { 
 
    if (status === 'OK') { 
 
     map.setCenter(results[0].geometry.location); 
 
    } else { 
 
     alert('Geocode was not successful for the following reason: ' + status); 
 
    } 
 
    }); 
 

 

 
}
#map { 
 
    height: 100%; 
 
} 
 
/* Optional: Makes the sample page fill the window. */ 
 
html, body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
}
<div id="map"></div> 
 
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU&callback=initMap" async defer></script>

関連する問題