Refresh Angular Google Map

http://stackoverflow.com/questions/36704139/angular-google-maps-typeerror-scope-map-control-refresh-is-not-a-function

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, uiGmapIsReady) {

  $scope.map = {
    show: false,
    //USA
    center: {
      latitude: 37.7749295,
      longitude: -122.4194155
    },
    zoom: 14,
    control: {}
  };

  $scope.refreshMap = function() {
    $scope.map.show = true;

    //France
    uiGmapIsReady.promise()
      .then(function(map_instances) {
        $scope.map.control.refresh({
          latitude: 48,
          longitude: 2.3
        });
      });
    //refresh success
  }

});