Time slider not showing up on web map

itsmichael — Mon, 09 May 2016 19:19:29 GMT

Hello everyone!

I am trying to make a web map with a time slider via HTML/CSS/JS. The time slider, however, is not showing up despite following the documentation.

Here is part of my code:

var map;

require([

"esri/map", "esri/dijit/InfoWindowLite",

"esri/InfoTemplate", "esri/layers/FeatureLayer", "esri/dijit/Legend", "esri/dijit/HomeButton",

"esri/dijit/BasemapGallery", "esri/arcgis/utils", "dojo/_base/array", "dojo/parser",

"esri/dijit/Scalebar", "esri/TimeExtent", "esri/dijit/TimeSlider", "dijit/layout/BorderContainer",

"dijit/layout/ContentPane", "dijit/TitlePane", "dijit/layout/AccordionContainer",

"dojo/dom-construct", "dojo/domReady!"

], function(

Map, InfoWindowLite, InfoTemplate, FeatureLayer, Legend, HomeButton, BasemapGallery, arcgisUtils,

arrayUtils, parser, Scalebar, TimeSlider, TimeExtent, BorderContainer, ContentPane, AccordionContainer, domConstruct

) {

parser.parse();

map = new Map("map", {

basemap: "gray",

center: [-101.15, 37.604],
zoom: 9

});

// Time Slider

map.on("load", initSlider);

function initSlider() {

var timeSlider = new TimeSlider({

style: "width: 100%;"

}, dom.byId("timeSliderDiv"));

map.setTimeSlider(timeSlider);

var timeExtent = new TimeExtent();

timeExtent.startTime = new Date("1/1/1966 UTC");

timeExtent.endTime = new Date("12/31/2014 UTC");

timeSlider.setThumbCount(1);

timeSlider.createTimeStopsByTimeInterval(timeExtent, 2, "esriTimeUnitsYears");

timeSlider.setThumbMovingRate(2000);

timeSlider.startup();

// Add labels at start and end

var labels = ['1966','2014'];

timeSlider.setLabels(labels);

timeSlider.on("time-extent-change", function(evt) {

var startValString = evt.startTime.getUTCFullYear();

var endValString = evt.endTime.getUTCFullYear();

dom.byId("daterange").innerHTML = "<b>" + endValString + "</b>";

});

}

I followed the example from ArcGIS documentation but it is not working on my end.

Thanks in advance!

Re: Time slider not showing up on web map

RobertScheitlin__GISP — Mon, 09 May 2016 19:37:53 GMT

Michael,

You have TimeExtent and TimeSlider reversed in your require parameters list.

], function(

Map, InfoWindowLite, InfoTemplate, FeatureLayer, Legend, HomeButton, BasemapGallery, arcgisUtils,

arrayUtils, parser, Scalebar, TimeSlider, TimeExtent, BorderContainer, ContentPane, AccordionContainer, domConstruct

) {

It should be:

], function(

Map, InfoWindowLite, InfoTemplate, FeatureLayer, Legend, HomeButton, BasemapGallery, arcgisUtils,

arrayUtils, parser, Scalebar, TimeExtent, TimeSlider, BorderContainer, ContentPane, AccordionContainer, domConstruct

) {

topic Time slider not showing up on web map in ArcGIS JavaScript Maps SDK Questions

Time slider not showing up on web map

Re: Time slider not showing up on web map