Error Refresh Angular Google Map

http://stackoverflow.com/questions/36704139

by westhacker

HTML

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js"></script>
<script src="https://rawgit.com/angular-ui/angular-google-maps/2.0.11/dist/angular-google-maps.min.js"></script>
<div ng-app="myApp" ng-controller="myController">
    <button ng-click="refreshMap()">
    refresh Map
    </button>
    <ui-gmap-google-map ng-if="map.show" center="map.center" zoom="map.zoom" control="map.control"></ui-gmap-google-map>
</div>

CSS

.angular-google-map-container {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
}

JavaScript

var myApp = angular.module('myApp', ['uiGmapgoogle-maps']);

myApp.controller('myController', function ($scope,$timeout) {
    
    $scope.map = {
        show: false,
        //USA
        center : {
            latitude: 37.7749295, 
            longitude: -122.4194155 
        },
        zoom : 14,
        control : {}
    };
    
    $scope.refreshMap = function(){
      $scope.map.show = true;
      
      //France
      $timeout(function(){
          $scope.map.control.refresh({latitude: 48,longitude: 2.3});
      },3000)
    	
     //refresh fail
    }
    
});