TimeSlider: Displaying data with 30 year window in 1 year steps

[MBenn22]

Hello,

I have created a service that contains 30Y rolling mean values.

The raster layer (MapServer) has values values for intervals from 1950 to 2022. So, we have 1950-1980, 1951-1981, 1952-1982, ..., 1992-2022.

When I use the timeSlider in mode time-window it only displays the intervals 1950-1980, 1980-2010, ....

  const timeSlider = new TimeSlider({
	container: "timeSlider",
	mode: "time-window",
	view: view,
	timeVisible: false,
	fullTimeExtent: {
	  start: new Date(-631152000000), // Jan 1, 1950,
	  end: new Date(1640995200000) // Jan 1, 2022
	},
	stops: {
	  interval: {
		value: 30,
		unit: "years"
	  }
	}
  });
  view.ui.add(timeSlider, "bottom-left");

Is it possible to set the stepping interval to 1 or 5 year steps, like it is possible in ArcGIS Pro?

Alternatively, is it possible to configure custom ranges (not stops)?

JavaScript API is quite new to me, so please point me out to the right direction.

Thank you.

[UndralBatsukh]

Hi there, 

I hope I am following what you are asking here. In any case, just set the TimeSlider.stops to your desired interval steps (e.g 1 year). 

const timeSlider = new TimeSlider({
  ...
  stops: {
    interval: {
      value: 1,
      unit: "years"
     }
  }
 });

[MBenn22 · Accepted solution]

Thank you @UndralBatsukh for the hint. I had to set  stops, fullTimeExtent and timeExtent.

const timeSlider = new TimeSlider({
  container: "timeSlider",
  view: view,
  mode: "time-window",
  fullTimeExtent: { 
        start: new Date(1950, 0, 1),
        end: new Date(2020, 0, 1)
  },
  timeExtent: { 
        start: new Date(1951, 0, 1),
        end: new Date(1981, 0, 1)
  },
  stops: {
    interval: {
        value: 1,
        unit: "years"
    }
  }
});

 Previously I had only set the fullTimeExtent and stops.