First time, map loads and the locations are plotted properly.
Second time, when the new set of locations are pulled from the app, map reloads and gets the new set of data. But it is not refreshed. The old plotted points are not getting removed.
[GIS] ESRI Maps – Refresh the map
arcgis-javascript-api
Related Solutions
I would consolidate all of those dojo.addOnLoad() calls. I suspect something isn't getting loaded before a function is getting called.
Strip all dojo.addOnLoad calls from all of your external javascript files and bundle them into one call in your main HTML file. Put all the functions you want to fire on load into a new function at the bottom of your javascript like this:
function init() {
basemapToggle();
layerToggle();
whatEver();
}
dojo.addOnLoad(init);
This will ensure that everything has loaded before trying to fire off any functions.
You are approaching this backwards--the time slider's time extent updates the map's time extent, not the other way around. It's my understanding that the map.setTimeExtent() function should only be called when a time slider is not in use.
You should be setting the extent of the time slider and setting the position of the time thumb(s), which then updates the current time extent of the map.
If you have already configured your time slider, this is as simple as:
// Assuming time slider has a single time thumb
timeSlider.setThumbIndexes([0]);
This will move the time slider's thumb position to the first time stop, which will then update the map's time extent to match. Any time-enabled layers will be listening for this event and will redraw automatically.
If you have two time thumbs, you have to set the index of each one:
// Moves first time thumb to the first time stop and the second time thumb to the second time stop
timeSlider.setThumbIndexes([0,1]);
Here is a more complete example, assuming you have data valid on the first day of each month:
var timeStops = [new Date(2013, 0, 1), new Date(2013, 1, 1), new Date(2013, 2, 1), new Date(2013, 3, 1), new Date(2013, 4, 1), new Date(2013, 5, 1), new Date(2013, 6, 1), new Date(2013, 7, 1), new Date(2013, 8, 1), new Date(2013, 9, 1), new Date(2013, 10, 1), new Date(2013, 11, 1)]
var timeSlider = new esri.dijit.TimeSlider({style: "width: 100%;"}, dojo.byId("timeSliderDiv"));
map.setTimeSlider(timeSlider);
timeSlider.setTimeStops(timeStops);
// Assuming slider has only one thumb:
timeSlider.setThumbCount(1);
// Set position of time slider's thumb to the first date (January 1, 2013):
timeSlider.setThumbIndexes([0]);
// Set animation speed to 1 second:
timeSlider.setThumbMovingRate(1000);
// Time slider thumb position represents an instantaneous time, rather than cumulative:
timeSlider.singleThumbAsTimeInstant(true);
// Allow animation to loop:
timeSlider.setLoop(true);
// Start it up!
timeSlider.startup();
If you already have a time slider and need to reset its time extent:
timeSlider.setTimeStops(newTimeStops);
// Assuming time slider has only one time thumb:
timeSlider.setThumbIndexes([newThumbIndex]);
// startup() must be called after updating time stops:
timeSlider.startup();
Best Answer
For the JS API you will need to remove the old layer before (or after if you want...) you add the new one in.
For example:
The map should update on its own. I will often do map.removeAllLayers() and re-add my layers from scratch in the correct order because it simplifies generalization (and re-draw is almost not noticeable).