我無法在google maps api上顯示我的地理定位標記.
我正在使用ng控制器ngGeolocation& http://angular-ui.github.io/angular-google-maps/
當我硬編碼標記和地圖位置時,我沒有遇到任何麻煩.
但是一旦我更換了控制器,地圖就消失了.
任何幫助非常感謝
我的控制器
‘使用嚴格’;
angular.module('fiveMinCatchupApp').controller('MainCtrl', function ($scope, uiGmapGoogleMapApi) {var scope = $scope;var lat; var lngfunction getLocation() {navigator.geolocation.getCurrentPosition($scope.showLocation);};$scope.showLocation = function(position){ lat = position.coords.latitude; lng = position.coords.longitude; $scope.map = { center: { latitude: position.coords.latitude, longitude: position.coords.longitude, }, zoom: 8}};getLocation();
主要的HTML
<ui-gmap-google-map center="map.center" zoom="map.zoom"><ui-gmap-markers models='markers'coords="'coords'"> </ui-gmap-markers></ui-gmap-google-map>
HTML
<body ng-app="fiveMinCatchupApp"><div class="container"><div ng-view=""></div></div><div class="footer"> <div class="container"> <p><span class="glyphicon glyphicon-heart"></span> from the Yeoman team</p> </div></div><!-- Google Analytics: change UA-XXXXX-X to be your site's ID --> <script> !function(A,n,g,u,l,a,r){A.GoogleAnalyticsObject=l,A[l]=A[l]||function(){ (A[l].q=A[l].q||[]).push(arguments)},A[l].l= new Date,a=n.createElement(g), r=n.getElementsByTagName(g)[0],a.src=u,r.parentNode.insertBefore(a,r) }(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-XXXXX-X'); ga('send', 'pageview');</script><script src='//maps.googleapis.com/maps/api/js?sensor=false'></script><!-- build:js(.) scripts/vendor.js --><!-- bower:js --><script src="bower_components/jquery/dist/jquery.js"></script><script src="bower_components/angular/angular.js"></script><script src="bower_components/bootstrap/dist/js/bootstrap.js"></script><script src="bower_components/angular-animate/angular-animate.js"></script><script src="bower_components/angular-cookies/angular-cookies.js"></script><script src="bower_components/angular-resource/angular-resource.js"></script><script src="bower_components/angular-route/angular-route.js"></script><script src="bower_components/angular-sanitize/angular-sanitize.js"></script><script src="bower_components/angular-touch/angular-touch.js"></script><script src="bower_components/lodash/dist/lodash.compat.js"></script><script src="bower_components/angular-google-maps/dist/angular-google-maps.js"></script><script src="bower_components/ngGeolocation/ngGeolocation.js"></script><!-- endbower --><!-- endbuild --> <!-- build:js({.tmp,app}) scripts/scripts.js --> <script src="scripts/app.js"></script> <script src="scripts/controllers/main.js"></script> <script src="scripts/controllers/about.js"></script> <!-- endbuild -->
謝謝!
以前的版本在github上硬編碼了
https://github.com/5-minute-catchup/5-min-catchup/commit/2899e013a78e93016154f1bd7d462b83f414db7e
解決方法:
這似乎對我有用:
angular.module('fiveMinCatchupApp').controller('MainCtrl', function ($scope, uiGmapGoogleMapApi) {$scope.map = { center: { latitude: 45, longitude: -73 }, zoom: 8 }; navigator.geolocation.getCurrentPosition(function(pos) { $scope.map.center = { latitude: pos.coords.latitude, longitude: pos.coords.longitude }; $scope.$apply(); });});
來源:https://www.icode9.com/content-1-277051.html