ThinkGeo.com    |     Documentation    |     Premium Support

Issue with remove Marker from SimpleMarkerOverlay

#1

Hello,



I am facing issue to remove marker from SimpleMarkerOverlay. also I have tried with creating new object of SimpleMarkerOverlay so that it will create a new instance of that and pass it to map. Also it pass new MapX and MapY coordinates but still it shows old marker on map.

I have used CloudPopup to show popup on map and bind  that popup from client side on map. CloudPopup shows at proper place but issue is with Marker it shows still at the same position if I pass new MapX and MapY coordinates.



I am pasting my code.




WebImage wimage = new WebImage(Url.Content(“ShapeFiles/Images/Locate.png”));
wimage.ImageOffsetY = -30;
wimage.ImageOffsetX = -10;            
 
SimpleMarkerOverlay markerOverlay = new SimpleMarkerOverlay(“markerOverlay”);            
markerOverlay.OnClientClick = “clickOnMarker”;
Marker mrk = new Marker(ps, wimage);
mrk.IsVisible = true;
 
markerOverlay.Markers.Add(mrk);
map.CustomOverlays.Remove(“markerOverlay”);
map.CustomOverlays.Add(markerOverlay);
 
CloudPopup popup = null;
popup = new CloudPopup(“Popup”, ps, Content, width, height, true, true);
popup.IsVisible = true;
return popup.ToJson();

And here is code on client side to call function to add Marker and call back function to add Popup on map.




function ShowMarker(htmlcontent,pLon,pLat)
{
            var params = { lon: pLon, lat: pLat, content: htmlcontent };
            Map1.ajaxCallAction(‘Home’, ‘AddMarker’, params, mapCallback);
}
 
function mapCallback(result) {            
            var olMap = Map1.getOpenLayersMap();
            for (var i = 0; i < olMap.popups.length; i++) {
                olMap.removePopup(olMap.popups);
            }
 
            var jsonPopup = JSON.parse(result.get_responseData());
            var popupCreator = new Popup(jsonPopup, null);
            olMap.addPopup(popupCreator.element, true);
            Map1.redrawLayer(“MarkerOverlay”);
}

Please check the code and let me know if I made some mistake in this.



Thank you.

#2

Hi Eric,



In Mvc Edition, adding/removing a new layer into the map in server side dynamically is not recommended, this is because most of the actions use the ajax call and the server side changes don’t sync in client side. A recommended way is we add all the required layer/Overlay into the map at first but mark some layers/overlay as invisible and in that way, the client side can store all the layers.



I create a sample for your issue, please try it and let us know if the issue persists.

Thanks,

Troy

Post12212.zip (512 KB)

#3

Hello Troy, 
  
 Thank you for your reply and yes that works for me. Thank you for your support. 
  
 Eric.

#4

Hi Eric, 
  
 Great to hear it works. 
 Any other questions, please feel free to let us know. 
  
 Thanks, 
 Troy

#5

Hello Troy, 
  
 I want to know that is there any client side function using which I can remove Marker from SimpleMarkerOverlay? as I have one method that go for reverse geocoding and if did not return any location in that case I want to remove old marker if it already set. 
  
 Thank you. 
 Eric.

#6

Hello, 
  
 Does any one knows about client side method or function to remove Marker from SimpleMarkerOverlay? Please give me suggestion for any other alternative to remove Marker from client side. 
  
 Thank you. 
 Eric.

#7

Hi Eric,



I think we need another AJAX call to remove marker from client side. Please see the following codes for details.

Controller:


[MapActionFilter]
        public void RemoveMarker(Map map, GeoCollection<object> args)
        {
            string id = args[0].ToString();
            SimpleMarkerOverlay markerOverlay = map.CustomOverlays["markerOverlay"] as SimpleMarkerOverlay;
 
            markerOverlay.Markers.Remove(id);
        }

View:



function removeMarker() {
        var olMap = Map1.getOpenLayersMap();
        var simpleMarkerLayer;
 
        for (var i = 0; i < olMap.layers.length; i++) {
            if (olMap.layers<i>.id == "markerOverlay") {
                simpleMarkerLayer = olMap.layers<i>;
            }
        }
 
        if (simpleMarkerLayer && simpleMarkerLayer.markers.length > 0) {
            Map1.ajaxCallAction('@ViewContext.RouteData.Values["Controller"].ToString()', 'RemoveMarker', { 'removingMarkerID': simpleMarkerLayer.markers[0].id }, function () {
                Map1.redrawLayer("markerOverlay");
            });
        }
    }


Hope
it helps and any other question please feel free to let us know.

Thanks,

Troy



#8

Hello Troy, 
  
 Thank you for your reply, Yes this works for me. Thank you for your help. 
  
 Eric.

#9

Hi Eric, 
  
 Great to hear it works. 
 If any other questions, don’t hesitate to let us know. 
  
 Thanks, 
 Troy