我在我的网络应用中使用角度ng-map。我构建了一个函数,它将获取所选用户的地址,在那里放置一个标记,然后放大它。但是,如果我不使用setTimeout
来关注我的标记,地图将自动捕捉到我的地理位置,尽管事实上我不会在我的应用程序中的任何地方使用geolocate。有谁知道这是怎么回事?为什么会这样?
控制器:
NgMap.getMap({id:'map'}).then(function(map) {
console.log('map', map);
vm.map = map;
//GEOCODER
var patientLat;
var patientLon;
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { "address": vm.myData.addressHome + ' ' + vm.myData.addressCity + ' ' + vm.myData.state + ' ' + 'USA'}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK && results.length > 0) {
var location = results[0].geometry.location;
patientLat = location.lat();
patientLon = location.lng();
console.log("the patient is located at " + patientLat + " " + patientLon);
vm.patientLocation = [
{
"patientLat" : patientLat
, "patientLon" : patientLon
}
]
setTimeout(function(){
patientPos(patientLat, patientLon);
}, 2000) <---------- here is the timeout i need
}
});
});
function patientPos(patientLat, patientLon) {
console.log(patientLat);
console.log(patientLon);
var bounds2 = new google.maps.LatLngBounds();
var latLng2 = new google.maps.LatLng(patientLat, patientLon);
bounds2.extend(latLng2);
vm.map.fitBounds(bounds2);
vm.map.setZoom(10);
}
HTML
<ng-map
id="map"
scrollwheel="false"
>
<marker
ng-repeat="q in vm.patientLocation"
position="{{q.patientLat}}, {{q.patientLon}}"
icon="{
url:'app/assets/img/patienticon.png',
scaledSize:[30,30]
}"
id="lkj98"
></marker>
<marker
ng-repeat="p in locatorGridData track by $index"
position="{{p.Location.Lat}}, {{p.Location.Long}}"
icon="{
url:'app/assets/img/placeholder.png',
scaledSize:[30,30]
}"
id="{{p.id}}"
on-click="vm.showDetail(p)"
class="markers"
></marker>
<shape id="circle" name="circle" centered="true"
stroke-color='#bc1212' stroke-opacity="0.8"stroke-weight="2"
center="current-position" radius={{vm.selectedRadius}} editable="false" ></shape>
<info-window id="infoWindow" visible-on-marker="lkj98yuih">
<div ng-non-bindable="">
<div class="practice-name">{{vm.p.Location.OrgName}}</div>
<div class="name-specialty">{{vm.p.Provider.firstName}} {{vm.p.Provider.lastName}}, {{vm.p.Provider.speciality}}</div>
<div class="other-text-for-info-window">
{{vm.p.Location.Address1}}<br>
{{vm.p.Location.City}}, {{vm.p.Location.State}}<br>
{{vm.p.Location.Zip}}
</div>
</div>
</info-window>
</ng-map>
答案 0 :(得分:1)
您正试图在控制器完成之前设置一个位置,因此值在$ digest循环中没有更新。基本上你过早地设置这些值。在您可以利用$scope.$$postdigest
方法后立即呈现它。
而不是你可以做的超时:
$scope.$$postDigest(function(){
patientPos(patientLat, patientLon);
})
或使用$timeout
方法:
$timeout(function(){
patientPos(patientLat, patientLon);
},0,false);
//Run immediately after digest (0 ms after) and do not trigger another digest cycle
假设您已经包含了控制器中的$scope
或$timeout
。
答案 1 :(得分:0)
原来我的shape
中有current position
<shape id="circle" name="circle" centered="true"
stroke-color='#bc1212' stroke-opacity="0.8"stroke-weight="2"
center="current-position" radius={{vm.selectedRadius}} editable="false" ></shape>
当我删除它时,一切都解决了