hallahan / LeafletPlayback

This is a Leaflet plug-in that plays back points that have a time stamp synchronized to a clock.
http://leafletplayback.theoutpost.io
Other
482 stars 165 forks source link

I can't remove the Control from the map. #38

Open pirbe7 opened 8 years ago

pirbe7 commented 8 years ago

How can I remove the Controlers from the map?

hallahan commented 8 years ago

What do you mean?

pirbe7 commented 8 years ago

I add the control to the map with the code below:

var _playback = new L.Playback(map, geoJson, null, _options);
m_ctrPlayback = new L.Playback.Control(_playback);
m_ctrPlayback.addTo(map);

But how can I remove it from the map?

When i try this

map.remove(m_ctrPlayback);

or this

map.removeControl(m_ctrPlayback);

nothing happen, or i got this error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

I add that bar within your example_2, with the play/pause buttons, slider for time and speed. Can you help me with this?

anjeludo commented 8 years ago

Hi @pirbe7 ,

I have the same problem. Did you solve it?.

Thanks.

EDIT: This worked for me:

playback.destroy();
playback = null;
vamsiampolu commented 8 years ago

When I remove the playback control with the destroy method, I find that the GPS tracks is still active.

playback = new L.Playback(map, data, null, {
   playControl: true,
   dateControl: true,
   sliderControl: true,
 })

I use this code to remove the control:

playback.destroy()

I managed to fix the issue by setting the tracksLayer option to false while creating the control, if this option is not set, it takes the default value of true and renders a layers control which would have to removed seperately.

AneriFumtiwala commented 7 years ago

I am facing same issue.

I have provide datetimepicker to select start and end date-time. On end-datetimepicker close event, i have called my web service to get history location data between selected time range.

On date selection event following things should be handled,

  1. Call to WS to get history data between selected time range. - done
  2. Update UI to show new history path – done
  3. Update existing playback slider with new history data – Playback javascript object is not getting updated with new data. Slider control is not working with new history data.

I have tried playback.setData method but it will place new marker on map with existing marker. Seek time is updated with new time but time-slider is not responding. Also tried above mention approach, but not working.

Please, help me out. Thanks in advance.

bsoviedo commented 2 years ago

I know its been a while for this issue, but i had to work in it, so, here is my way for delete the "GPS tracks" layer control:

I initialize a variable before the class L.Playback.TracksLayers, an empty variable.

Then, when the layer Control is added (in line 540 or 550), i use that empty variable for innit the Layer control.

finally, i added a method in the L.Playback.TrackLayers class that i called "deleteControl", and just used the .remove() method in layers control according to Leaflet documentation.

My solution code looks something like this:

let layerControl; //<--- initialize empty variable

L.Playback.TracksLayer = L.Class.extend({

//Here are the initializr options options in the original code

    layerControl= L.control.layers(null, overlayControl, {  //<--- init the layer control in that variable
        collapsed : false, 
        position:'bottomleft'
    }).addTo(map)
},

//Here are another options in the original code

deleteControl : function(){
    layerControl.remove() // <--- here i call the remove method and i can erase the Gps tracks control simply calling 
                                         //deleteControl() function
}

});

I hope my solution could be usefull for somebody :)