angular-ui / ui-leaflet

AngularJS directive to embed an interact with maps managed by Leaflet library
http://angular-ui.github.io/ui-leaflet
Other
314 stars 134 forks source link

Markers disappearing after a while of panning and zooming #163

Open nmccready opened 9 years ago

nmccready commented 9 years ago

From @alakiikonen on May 11, 2015 12:3

The markers on the map are dissappearing seemingly randomly. This happens after a while of zooming in and out, and panning around. Not much zooming is required sometimes. GeoJson is not disappearing.

Has anyone else had this problem?

Leaflet html

<leaflet id="bigMap"  bounds="bounds" center="center"  defaults="defaults"  event-broadcast="events" markers="markers" geojson="geojson" width="100%" height="1000px"></leaflet>

Defaults

angular.extend($scope, {
            defaults: {
                tileLayer: "...",
                zoomControl: true,
                scrollWheelZoom: true,
                markerZoomAnimation: false,
                tileLayerOptions: {
                    attribution:  "..."
                }
            },
            markers: [],
            events : {},
            geojson: {
                data:[],
                style: geoJsonStyle
            }
        });

Markers are set using a function:

function setMapMarkers(data) {
            var markers = [];
            angular.forEach(data, function(dataPoint) {
                    var marker = {
                            compileMessage: true,
                            getMessageScope: function () { return $scope; },
                                    lat: dataPoint.location.latitude,
                                    lng: dataPoint.location.longitude,
                                    message: createHtmlForFataPointInMap(dataPoint),
                                    icon: getMarkerIcon(dataPoint),
                                    focus: false,
                                    name: dataPoint.id,
                                    popupOptions: {
                                        className: 'marker-popup-top',
                                        zIndexOffset: 9999
                                    }
                    }
                    markers.push(marker);
                });
            $scope.markers = markers;
}

Versions: angular-leaflet-directive 0.7.15 2015-04-27 AngularJS v1.3.15 Leaflet.jos 0.7.3

Copied from original issue: tombatossals/angular-leaflet-directive#749

nmccready commented 9 years ago

Can you host this on a jsfiddle?