TimeSlider - Get Irregular Stops from Field

YogaYoda

Looking for a little guidance on irregular stops for the TimeSlider widget. I have a point feature layer with a start_time field. Normally I use the "instant" mode and add the stops manually by adding the new date/time instance to the end of the array. For example stops: { dates: [ new Date(2021, 3, 7, 5, 25, 0), new Date(2021, 3, 7, 9, 15, 0), new Date(2021, 3, 7, 15,10, 0)) ] }.

This works fine and meets the need, but as updates to the layer are frequent I don't have the time to consistently add the new dates as they occur. Is there a method that would allow me to add each date in the field as a stop in the TimeSlider widget without having to add it manually? Each timestamp in the layer must be viewed on the slider, though multiple points may share the exact same timestamp.

Thanks!

 

 

UndralBatsukh

Hi there, 

There are several ways of doing this. I created a simple app for you to show how to get all unique date values from your FeatureLayer and create date arrays. This way, your app should pick all changes when your layer updates. 

In the app, I am waiting for the layer to load then I am getting all unique values from the date field using smarting mapping uniqueValues  module as shown below. Then I loop through the date values and add them to dates array. Use the date array to set the TimeSlider.stops and fullTimeExtent. 

view.whenLayerView(layer).then(function (lv) {
  // get unique values from the date field 
  uniqueValues({
    layer: layer,
    field: "perimeterdatetime"
  }).then(function (response) {
    let infos = response.uniqueValueInfos;
    infos.forEach(function (info) {
      const dt = new Date(info.value);
      dates.push(dt);
    });
    timeSlider.stops = { dates };
    timeSlider.fullTimeExtent = {
       start: dates[0],
       end: dates[dates.length - 1]
     };
     const start = dates[0].getTime();
     const where = `perimeterdatetime = ${start}`;

     layerView = lv;
     layerView.filter = {
       where
     };
   });
});

 

Hope this helps,

-Undral