更改標記圖標和彈出消息關閉

我正在使用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

更改標記圖標和彈出消息關閉

回答

相關問題