Question

我正在加载一个数组中带有不同标记的地图。我需要为每个人生成click事件并显示消息，气球或其他内容。尝试下面的代码块，但不要让我离开我的代码。

测试：

google.maps.event.addListener(marker, 'click', function() {
  map.setZoom(8);
  map.setCenter(marker.getPosition());
});

我的代码：

<map center="{{latitud}}, {{longitud}}" zoom="12" id="map_views">
              <div id="class" ng-repeat="marker in markers | orderBy : 'title'">
                  <marker position="{{marker.latitud}}, {{marker.longitud}}" />
              </div>
          </map>

控制器：

.controller('MisViewsCtrl',   function($scope,$ionicNavBarDelegate,$timeout,$location,$ionicPlatform,$ionicLoading, $compile){

  $scope.views = [
      {
      id : 0,
      nombre : 'Problema con cableado',
      fecha : '18/05/2014 a las 15:17',
      estado : 'En revisión',
      latitud : -33.3995448,
      longitud : -70.5705277,
      img : 'img/cables.JPG',
      comentario : 'Exiten problemas en el cableado, estan sueltos y es peligroso. Concurre mucha gente por ese lugar.',
      clase : 'label_estado label-warning'
  },
  {
      id : 1,
      nombre : 'Poste en mal estado',
      fecha : '09/11/2013 a las 20:45',
      estado : 'Solucionado',
      latitud : -33.4024754,
      longitud : -70.5919616,
      img : 'img/poste.jpeg',
      comentario : 'El poste esta a punto de caer, se encuentra en una calle muy concurrida por personas y automóviles.',
      clase : 'label_estado label-success'
  },
  {
      id : 2,
      nombre : 'Cañeria rota',
      estado : 'Falta información',
      fecha : '03/03/2012 a las 12:13',
      latitud : -33.406975,
      longitud : -70.57283,
      img : 'img/caneria.jpg',
      comentario : 'Esta rota y oxidada, corre agua por todo el lugar.',
      clase : 'label_estado label-info'

  }
 ];
    $scope.markers = [];
    $scope.createMarker = function(info){
        $scope.markers.push(info); 
    }  

    for (i = 0; i < $scope.views.length; i++){
        $scope.createMarker($scope.views[i]);
    }
})

Answer 1

我认为你只是削减了事件

    google.maps.event.addListener(marker, 'click', function() { map.setZoom(8);
  map.setCenter(marker.getPosition());
    });

循环标记数组试试this demo 来自geocodezip

点击事件标记地图

1 个答案: