我想通过自动完成搜索在google-angular-map上放置标记,我得到经纬度形式的位置,但标记没有添加,请检查....
控制器代码
$timeout(function() {
var input = document.getElementById('pac-input');
var searchBox = new google.maps.places.SearchBox(input);
google.maps.event.addListener(searchBox, 'places_changed', function() {
var marker= [] ;
var places = searchBox.getPlaces();
if (places.length == 0) {
return;
}
var loc_data = {
coords: {
latitude: places[0].geometry.location.lat(),
longitude: places[0].geometry.location.lng()
}
};
marker.push(loc_data);
$scope.markers=marker;
});
HTMl代码
<ui-gmap-markers models="markers" idkey="markers.id" coords="'coords'" >
</ui-gmap-markers>
<div class="col-md-4">
<input id="pac-input" class="controls" type="text" placeholder="Search Box">
</div>
答案 0 :(得分:1)
Response
//此示例使用Google地方自动填充功能向地图添加搜索框 //功能人们可以输入地理搜索。搜索框将返回一个 //选择包含地点和预测搜索字词组合的列表。
<div class="form-group">
<label for="pacinput" class="control-label col-md-4">Search Location</label>
<div class="col-md-8">
<input id="pacinput" class="form-control" type="text" placeholder="Search Location">
</div>
</div>
<div class="form-group">
<div class="col-md-offset-4 col-md-8">
<asp:HiddenField runat="server" ID="address" />
<asp:HiddenField ID="txtLat" runat="server" />
<asp:HiddenField ID="txtLng" runat="server" />
<div id="map" style="width: 100%; height: 380px;">
</div>
</div>
</div>
答案 1 :(得分:0)
您需要创建一个标记才能将其放置在地图上。
var marker = new google.maps.Marker({
position: loc_data.coords,
map: yourMapID
});
如果你想添加一个drop动画或听众:
marker.setAnimation(google.maps.Animation.DROP);
marker.addListener('click', yourHandlerFunction);