Problem with maps in different views

Hi, I’m trying to show different maps in different views but charging 1 on 1 map view, switch to another map not load, there is no mistake to launch the browser so I could not decide because I can not keep showing other maps. I’m doing as follows:

$scope.cargarUbicacion = function () {
if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function (position) {
          latitud_actual = position.coords.latitude; 
          longitud_actual = position.coords.longitude;
          var mapOptions = {
              center: new google.maps.LatLng(latitud_actual, longitud_actual),
              zoom: 15,
              mapTypeId: google.maps.MapTypeId.ROADMAP,
              scrollwheel: false
          map = new google.maps.Map(document.getElementById("mapa_ubicacion"), mapOptions);
          $scope.setMarker(map, new google.maps.LatLng(latitud_actual, longitud_actual), 'Yo', '');
  $scope.setMarker = function(map, position, title, content) {
  var marker;
  var markerOptions = {
      position: position,
      map: map,
      title: title,
      icon: ''

  marker = new google.maps.Marker(markerOptions);
  markers.push(marker); // add marker to array
  google.maps.event.addListener(marker, 'click', function () {
      // close window if not undefined
      if (infoWindow !== void 0) {
      // create new window
      var infoWindowOptions = {
          content: content
      infoWindow = new google.maps.InfoWindow(infoWindowOptions);, marker);

I am using this code in multiple controllers, my idea is encapsulated and can occupy the same code 1 time in several views. Whenever I change the id map to avoid that problem, thinking that this was the cause that did not load the map.

<div id="mapa_ubicacion" style="width:100%;height: 140px;"></div>

Any idea how to do what I need or that is failing to load maps?

Thank you.