javascript - 无论我点击什么位置，都在 Google map 上添加标记

Question

我想实现类似的东西 http://jsfiddle.net/sya8gn0w/1/ 。

现在的问题是我有自己的自定义指令来显示 map 。我想要子 Controller 中的一个函数，它将在单击某些按钮时实现上述功能。

例如。仅当我单击某个按钮时，地点标记功能才会触发。

当前代码 -

function ParentCtrl($scope){
    var mainCtrl = this;

    angular.extend(mainCtrl , {
        map: {
            center: {
                latitude: 18.5,
                longitude: 73.85
            },
            zoom: 13,
            markers: [],
            events: {
                click: function (map, eventName, originalEventArgs) {
                    var e = originalEventArgs[0];
                    var lat = e.latLng.lat(), lon = e.latLng.lng();
                    var marker = {
                        id: Date.now(),
                        coords: {
                            latitude: lat,
                            longitude: lon
                        }
                    };
                    mainCtrl .map.markers.pop();
                    mainCtrl .map.markers.push(marker);
                    console.log(mainCtrl .map.markers);
                    console.log("latitude : "+lat+" longitude : "+lon);
                    $scope.$apply();
                }
            }
        }
    });
};

我想将 angular.extend 的“click:”部分中存在的功能移动到 ChildCtrl Controller 中存在的功能。是否可以 ？否则建议我采用不同的方法来实现这一目标。

Answer 1

不知道我的回答是否对你有帮助。最近在做GoogleMap，想分享一下我所知道的。

  angular.extend(scope, {
  map: {
    show: true,
    control: {},
    version: 'uknown',
    center: {
      latitude: 0,
      longitude: 0
    },
    options: {
      streetViewControl: false,
      panControl: false,
      maxZoom: 10,
      minZoom: 1
    },
    zoom: 2,
    dragging: false,
    bounds: {},
    markers: scope.markers,
    doClusterMarkers: true,
    currentClusterType: 'standard',
    clusterTypes: clusterTypes,
    selectedClusterTypes: selectedClusterTypes,
    clusterOptions: selectedClusterTypes['standard'],
    events: {
      tilesloaded: function(map, eventName, originalEventArgs) {},
      click: function(mapModel, eventName, originalEventArgs) {},
      dragend: function() {}
    },
    toggleColor: function(color) {
      if (color === 'red') {
        return '#6060FB';
      } else {
        return 'red';
      }
    }
  }

这里的语句markers:scope.markers将有助于创建新标记或删除旧标记。

在“ChildCtrl”中，您编写一个函数来更新父 Controller 的scope.markers对象。