Popups funktioniert nicht richtig mit Kreismarker

Ich habe ein Problem mit der Kreismarkierung in ui Prospekt Plugin. Wann immer jemand auf einen Kreis klickt, um das Popup zu erhalten, aber wenn ich außerhalb des Kreises in der Karte klicke und dann erneut auf Kreis klicke, wird das Popup nicht angezeigt.Popups funktioniert nicht richtig mit Kreismarker

Können Sie bitte vorschlagen, was das Problem sein könnte? und gibt es einen Workaround dafür?

Schritte

In der Karte klicken Sie auf einen Kreis Marker
Bewegen Sie den Kreis Marker der Karte außerhalb des Gültigkeitsbereichs zu reproduzieren versuchen
Dann andere Marker Klicken auf die Pop-up nicht
erscheinen wird, wenn Ich klickte außerhalb des Kreises und klickte wieder Kreis das Pop-up wieder erscheint

Unten ist das Schnipsel der c ode, wenn Sie vollständige Code benötigen, besuchen Sie bitte diese Github Link

https://github.com/Umamaheswaran1990/learningleaflet

HTML

<!DOCTYPE html> 
<html ng-app="demoapp"> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <script src="../bower_components/angular/angular.min.js"></script> 
    <script src="../bower_components/leaflet/dist/leaflet.js"></script> 
    <script src="../bower_components/angular-simple-logger/dist/angular-simple-logger.js"></script> 
    <script src="../bower_components/ui-leaflet/dist/ui-leaflet.min.js"></script> 
    <link rel="stylesheet" href="../bower_components/leaflet/dist/leaflet.css" /> 
    <script src="app.js"></script> 
</head> 
<body ng-controller="LayersSimpleController as vm"> 
    <leaflet center="center" tiles="tiles" paths="paths" width="50%" height="480px"></leaflet> 
</body> 
</html>

var app = angular.module("demoapp", ['ui-leaflet']); 
app.controller("LayersSimpleController", ["$scope", function ($scope) { 
    var vm = this; 

    $scope.$on('leafletDirectiveMap.map.load', function (event, data) { 
     var map = data.leafletObject; 
     map.attributionControl.setPrefix(false); 
    }); 

    $scope.$on('leafletDirectiveMap.moveend', function (event, data) { 
     activate(); 
    }); 

    var map = [ 
     { "lat": 30.7559, "lon": -96.489 }, 
     { "lat": 41.8887, "lon": -111.769 }]; 

    angular.extend($scope, { 
     center: { 
      lat: 39.774769, 
      lng: -98.789062, 
      zoom: 4, 
      minZoom: 4, 
      zoomControl: true, 
     }, 
     events: {}, 
     tiles: { 
      url: 'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', 
      options: { 
       subdomains: ['otile1', 'otile2', 'otile3', 'otile4'] 
      }, 
      layers: {}, 
      defaults: { 

      } 
     } 
    }); 

    activate(); 

    function activate() { 
     $scope.paths = {}; 
     angular.forEach(map, function (value, key) { 
      if (value.lat !== null && value.lon !== null) { 
       $scope.paths['circle' + key] = { 
        type: 'circleMarker', 
        className: 'testClass', 
        fillColor: 'DarkSlateGray', 
        color: '#000000', 
        weight: 0, 
        opacity: 1, 
        message: 'This is a test marker', 
        fillOpacity: 0.8, 
        stroke: false, 
        clickable: true, 
        latlngs: [parseFloat(value.lat), parseFloat(value.lon)], 
        radius: 20 
       }; 
      } 
     }); 
    } 
}]);

Quelle

2016-06-21 Umamaheswaran

Haben Sie beide Browser versucht? Ich meine, bleibt das Problem in beiden Browsern? –

@pdfarhad Ich bin in der Lage, das Problem sowohl in Chrome und Forefox zu reproduzieren, das funktioniert in Edge-Browser – Umamaheswaran

Ich habe es durch die Arbeit Zugabe

event-broadcast="events"

zum Faltblatt Element in index.html und das Hinzufügen von

events: { 
      path: { 
       enable: ['click'] 
       } 
     },

app.js

Ich bin nicht sicher, warum dies notwendig war, als das ui-Faltblatt Ereignisse Beispiel sagt, dass Alle Broadcast-Ereignisse sind standardmäßig aktiviert. http://angular-ui.github.io/ui-leaflet/examples/0000-viewer.html#/basic/events-example

Quelle

2016-09-20 15:52:13 jm22

Danke !! Lass es mich ausprobieren und als Antwort markieren – Umamaheswaran

Popups funktioniert nicht richtig mit Kreismarker

Antwort

Verwandte Themen