1

除了轮询之外,当我手动向地图添加点时,我无法显示窗口。只有预先填充了标记数组,它才会起作用。如果数组预先填充了 1 个标记,然后我在地图加载后手动添加第二个标记,则第一个标记将显示窗口,但第二个不会。这是具有不同纬度/经度的相同标记。据我所知,我的代码几乎与这个 plunker 相同,只是我没有轮询数据。

http://plnkr.co/edit/nbX0BIxNhxFrpzpruRWb?p=preview

http://54.210.49.244:4000/gMaps

我用于 luls 的个人网站。是的,我懒得得到一个真正的域名。它是免费的,好的 XD 证明了这个问题。不支持 IE 9 或更低版本。

这是控制器逻辑。

.controller("gMapsController", ["$scope", '$location', function($scope, $location){
    $scope.welcomeMessage = "Welcome to Google Maps Playground"

    $scope.map = {
        center: {
            latitude: 44.41748017333282,
            longitude: 26.106005249023376
        },
        zoom: 12
    }
    $scope.id = 0;
    $scope.map.bounds = {};
    $scope.map.randomMarkers = [{
        id: 0,
        latitude: 44.42138408826953,
        longitude: 26.25385948707207,
        showWindow: false,
        title: "m9"
    },
        {
        id: 1,
        latitude: 44.39138408826953,
        longitude: 26.21385948707207,
        showWindow: false,
        title: "m9"
    }];

    $scope.id++;
    $scope.id++;
    $scope.id++;

    angular.forEach($scope.map.randomMarkers, function(marker) {
        marker.showWindow = false;

        marker.onClick = function() {
            console.log('on click - opening window');
            marker.showWindow = true;
            $scope.$apply();
        }

        marker.closeClick = function() {
            console.log('close click - hiding window');
            marker.showWindow = false;
            $scope.$apply();
        }

        console.log(marker);

    });


    var generateMarkers = function(markers) {


        markers.showWindow = false;

        markers.onClick = function() {
                console.log('on click - opening window');
                markers.showWindow = true;
                $scope.$apply();
            };

        markers.closeClick = function() {
                console.log('close click - hiding window');
                marker.showWindow = false;
                $scope.$apply();
            };

            console.log(markers);


        $scope.map.randomMarkers.push(markers);

    };

    $scope.generateMarker = function(){
        var marker = {
            id: $scope.id,
            latitude: 44.41138408826953,
            longitude: 26.23385948707207,
            showWindow: false,
            title: "m9",
            draggable: true
        };
        console.log("marker added");
        generateMarkers(marker);
        $scope.id++;
    };

风景

div.container
    button(type = "button", ng-click="generateMarker()") Add a Marker
    div.row()
        div(class = "col-md-6")
            google-map(center="map.center", zoom="map.zoom", draggable="true", bounds="map.bounds", control="map.control")
                markers(models="map.randomMarkers", coords="'self'", icon="'icon'", click="'onClick'")
                    windows(show="'showWindow'", closeClick="'closeClick'", ng-cloak)
                        div
                            | Window with additional information
4

1 回答 1

0

查看以下问题angular-google-maps

https://github.com/nlaplante/angular-google-maps/issues/354似乎与您的问题有关(毕竟您的方法都在 中$scope)并在此处进行了修复

于 2014-07-16T14:35:17.867 回答