在我的应用中,我要从Google Places API中获取数据,并在Google地图上显示标记。在这部分中,我将显示标记,然后获取位置,并将其发送到我的后端。有人可以帮忙吗?
<input
type="text"
id="pac-input"
className="controls"
placeholder="Search Box"
value={this.state.fields["event_location"] || ''}
onChange={this.onChange.bind(this, "event_location")} />
<div id="map"></div>
<p>Unable to locate? <button className="btn btn-default inline" data-toggle="collapse" data-target="#address_panel">Enter an Address</button></p>
答案 0 :(得分:1)
您可以使用textSearch()
方法执行您想要的操作。例如:
var map;
var service;
var infowindow;
function initialize() {
var pyrmont = new google.maps.LatLng(-33.8665433,151.1956316);
map = new google.maps.Map(document.getElementById('map'), {
center: pyrmont,
zoom: 15
});
var request = {
location: pyrmont,
radius: '500',
query: 'restaurant'
};
service = new google.maps.places.PlacesService(map);
service.textSearch(request, callback);
}
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var place = results[i];
createMarker(results[i]);
}
}
}
Google Places API非常好,所以请花些时间阅读它。
如果您想使用使用React组件的软件包,我建议react-google-maps。你应该看看。