diff --git a/src/directives/markers.js b/src/directives/markers.js index 74ef2c6c..ce9b0e65 100644 --- a/src/directives/markers.js +++ b/src/directives/markers.js @@ -43,7 +43,8 @@ angular.module("leaflet-directive").directive('markers', function ($log, $rootSc // Delete markers from the array for (var name in leafletMarkers) { if (!isDefined(newMarkers) || !isDefined(newMarkers[name])) { - deleteMarker(map, leafletMarkers, layers, groups, name); + deleteMarker(map, leafletMarkers[name], layers, groups); + delete leafletMarkers[name]; } } @@ -51,9 +52,11 @@ angular.module("leaflet-directive").directive('markers', function ($log, $rootSc for (var newName in newMarkers) { if (!isDefined(leafletMarkers[newName])) { var newMarker = createMarker('markers.'+newName, newMarkers[newName], leafletScope, map, layers, groups, shouldWatch); - if (isDefined(newMarker)) { - leafletMarkers[newName] = newMarker; + if (!isDefined(newMarker)) { + $log.error('[AngularJS - Leaflet] Received invalid data on the marker ยก ' + newName + '.'); + continue; } + leafletMarkers[newName] = newMarker; } } }, shouldWatch); diff --git a/src/services/leafletMarkersHelpers.js b/src/services/leafletMarkersHelpers.js index 9ab2cbfe..9f33d0c1 100644 --- a/src/services/leafletMarkersHelpers.js +++ b/src/services/leafletMarkersHelpers.js @@ -9,23 +9,6 @@ angular.module("leaflet-directive").factory('leafletMarkersHelpers', function ($ safeApply = leafletHelpers.safeApply, availableMarkerEvents = leafletEvents.getAvailableMarkerEvents(); - var LeafletDefaultIcon = L.Icon.extend({ - options: { - iconUrl: 'http://cdn.leafletjs.com/leaflet-0.7/images/marker-icon.png', - iconRetinaUrl: 'http://cdn.leafletjs.com/leaflet-0.7/images/marker-icon-2x.png', - iconSize: [25, 41], - iconAnchor: [12, 40], - labelAnchor: [10, -20], - popupAnchor: [0, -40], - shadow: { - url: 'http://cdn.leafletjs.com/leaflet-0.7/images/marker-shadow.png', - retinaUrl: 'http://cdn.leafletjs.com/leaflet-0.7/images/marker-shadow.png', - size: [41, 41], - anchor: [12, 40] - } - } - }); - var hasLabel = function(marker) { return Helpers.LabelPlugin.isLoaded() && isDefined(marker.label); }; @@ -38,42 +21,6 @@ angular.module("leaflet-directive").factory('leafletMarkersHelpers', function ($ } }; - var getLeafletIcon = function(data) { - return new LeafletDefaultIcon(data); - }; - - var buildMarker = function(data) { - if (!isDefined(data)) { - return; - } - - var micon = null; - if (data.icon) { - micon = data.icon; - } else { - micon = getLeafletIcon(); - } - var moptions = { - icon: micon, - draggable: data.draggable ? true : false, - clickable: isDefined(data.clickable) ? data.clickable : true, - riseOnHover: isDefined(data.riseOnHover) ? data.riseOnHover : false - }; - if (data.title) { - moptions.title = data.title; - } - var marker = new L.marker(data, moptions); - - if (data.message) { - marker.bindPopup(data.message); - } - if (Helpers.LabelPlugin.isLoaded() && isDefined(data.label) && isDefined(data.label.message)) { - marker.bindLabel(data.label.message, data.label.options); - } - - return marker; - }; - var genDispatchEventCB = function(eventName, logic, scope_watch_name, leafletScope, marker, marker_data) { return function(e) { var broadcastName = 'leafletDirectiveMarker.' + eventName; @@ -112,12 +59,42 @@ angular.module("leaflet-directive").factory('leafletMarkersHelpers', function ($ }; }; + var getLeafletIcon = function(iconData) { + if (!isDefined(iconData)) { + return new L.Icon.Default(); + } + return new L.Icon.Default(iconData); + }; + + var buildMarker = function(data) { + if (!isDefined(data)) { + return; + } + var markerOptions = { + icon: getLeafletIcon(data.icon), + draggable: isDefined(data.draggable) ? data.draggable : false, + clickable: isDefined(data.clickable) ? data.clickable : true, + riseOnHover: isDefined(data.riseOnHover) ? data.riseOnHover : false + }; + if (isDefined(data.title)) { + markerOptions.title = data.title; + } + var marker = new L.marker(data, markerOptions); + + if (isDefined(data.message)) { + marker.bindPopup(data.message); + } + if (Helpers.LabelPlugin.isLoaded() && isDefined(data.label) && isDefined(data.label.message)) { + marker.bindLabel(data.label.message, data.label.options); + } + + return marker; + }; + return { getLeafletIcon: getLeafletIcon, - deleteMarker: function(map, leafletMarkers, layers, groups, name) { - var marker = leafletMarkers[name]; - + deleteMarker: function(map, marker, layers, groups) { // There is no easy way to know if a marker is added to a layer, so we search for it // if there are overlays if (isDefined(layers) && isDefined(layers.overlays)) { @@ -125,6 +102,7 @@ angular.module("leaflet-directive").factory('leafletMarkersHelpers', function ($ if (layers.overlays[key] instanceof L.LayerGroup) { if (layers.overlays[key].hasLayer(marker)) { layers.overlays[key].removeLayer(marker); + continue; } } } @@ -134,18 +112,19 @@ angular.module("leaflet-directive").factory('leafletMarkersHelpers', function ($ for (var groupKey in groups) { if (groups[groupKey].hasLayer(marker)) { groups[groupKey].removeLayer(marker); + continue; } } } map.removeLayer(marker); - delete leafletMarkers[name]; }, createMarker: function(scope_watch_name, marker_data, leafletScope, map, layers, groups, shouldWatch) { var marker = buildMarker(marker_data); if (!isDefined(marker)) { + $log.error('[AngularJS - Leaflet] The marker definition is not valid.'); return; } diff --git a/test/unit/markersDirectiveSpec.js b/test/unit/markersDirectiveSpec.js index 256e2039..37727461 100755 --- a/test/unit/markersDirectiveSpec.js +++ b/test/unit/markersDirectiveSpec.js @@ -463,7 +463,7 @@ describe('Directive: leaflet', function() { var DEFAULT_URL = 'http://cdn.leafletjs.com/leaflet-0.5.1/images/marker-icon.png'; beforeEach(function(){ - leafIcon = L.icon({ + leafIcon = { iconUrl: LEAF_URL, shadowUrl: 'http://leafletjs.com/docs/images/leaf-shadow.png', iconSize: [38, 95], @@ -471,8 +471,8 @@ describe('Directive: leaflet', function() { iconAnchor: [22, 94], shadowAnchor: [4, 62], popupAnchor: [-3, -76] - }); - defaultIcon = L.icon({ + }; + defaultIcon = { iconUrl: DEFAULT_URL, shadowUrl: 'http://cdn.leafletjs.com/leaflet-0.5.1/images/marker-shadow.png', iconSize: [25, 41], @@ -480,7 +480,7 @@ describe('Directive: leaflet', function() { popupAnchor: [0, 40], shadowSize: [41, 41], shadowAnchor: [12, 40] - }); + }; mainMarkers = { m1: { @@ -503,7 +503,8 @@ describe('Directive: leaflet', function() { }); scope.$digest(); - expect(markers.m1.options.icon.options.iconUrl).toEqual(LEAF_URL); + var icon = markers.m1.options.icon; + expect(icon.options.iconUrl).toEqual(LEAF_URL); mainMarkers.m1.icon = defaultIcon; scope.$apply();