更改标记图标和弹出消息关闭

我正在使用leaflet.awesome-markers卡片标记。当您更改图标的颜色时，会立即关闭弹出消息。更改标记图标和弹出消息关闭

是否可以在不关闭弹出窗口的情况下更改颜色？

$scope.$on('leafletDirectiveMarker.viewMap.click', function(e, args){ 
    $scope.selectedPoint = $scope.points.filter(function(spoint){ return spoint._id === args.modelName; })[0]; 
    $scope.waypoints[$scope.selectedPoint._id].icon.markerColor = 'green'; 
});

来源

2016-02-11 Алексей

你可以做小提琴吗？ – cl3m

即使在http://tombatossals.github.io/angular-leaflet-directive/examples/0000-viewer.html#/markers/icons-example –

示例中，也可以观察到这一点如果执行e.preventDefault（） ; $ scope.selectedPoint之前？ – kozer

L.Marker.setIcon()使用代替，和停止事件的传播，最好用L.DomEvent.stop()因为它会从标记到地图停止的事件click传播（通过任何L.LayerGroups，如果有的话）。

在普通的JavaScript（没有角度），这将是：

marker.on('click', function(ev) { 
    marker.setIcon(L.icon({ iconUrl: 'some-green-icon.png' })); 
    // Also this.setIcon(...) 

    L.DomEvent.stop(ev);  
});

来源

2016-02-11 19:06:35 IvanSanchez

你能举个例子吗？ –

是的，我编辑了答案。 – IvanSanchez

问题在于，在点击标记之前出现的事件是打开弹出窗口，因此它不能解决问题。尽管这个决定本身已经发现。稍后，我会分享。 –

对于自己，我解决了这样的问题 - 添加和显示的弹出式窗口在必要时不使用的标准机制的角度（为指定消息标记）。您当然可以在加载数据时立即初始化弹出消息，但在我的项目中更容易实现按需。

//popup's store 
$scope.popups = {}; 

$scope._setViewMarker = function(pId, showPopup){ 
var wp = $scope.waypoints; 
wp[pId].icon.markerColor = 'red'; 

//set unselected markers color 
for (var i in wp) 
    if(i != pId){ 
     wp[i].icon.markerColor = 'blue'; 
    }; 
// close other popups 
for (var i in $scope.popups) 
    if(i != pId) 
     $scope.map.closePopup($scope.popups[i]);   
// show or create poupap 
if(showPopup) 
    if($scope.popups[pId]){ 
     if(!$scope.popups[pId]._isOpen) 
      $scope.map.openPopup($scope.popups[pId]); 
    } else { 
     var ind = $scope.points.map(function(e) { return e._id; }).indexOf(pId); 
     var c = angular.element('<popup point="points['+ind+']" note-click="showDetailPoint(points['+ind+'])"></popup>'); 
     var linkFn = $compile(c); 
     var element = linkFn($scope); 
     $scope.popups[pId] = L.popup({offset:[0, -30]}).setLatLng([wp[pId].lat, wp[pId].lng]).setContent(element[0]).openOn($scope.map); 
     $scope.popups[pId].pointId = pId; 
    }; 
};  
$scope.$on('leafletDirectiveMarker.viewMap.click', function(e, args){ 
    $scope._setViewMarker(args.modelName, true); 
});

来源

2016-02-14 14:27:35

更改标记图标和弹出消息关闭

回答

相关问题