Customizing the time slider in ArcGIS Java Script API 3.1

Question

I want to customize the time slider. Currently I am using "esriTimeUnitsMonths" in which I am getting only months not the year (Please check the image)

I want to put month name +year ex. Jan 09 Feb 09 like that..

I researched on google but I am not able find suitable information. Some one told me that create the array but we can use array on time slider.

Any help will be great..thanks in advance : )

Software : ArcGIS Server 10.1 & ArcGIS Java Script API 3.1

Code: `

var timeExtent = new esri.TimeExtent();
        timeExtent.startTime = new Date("1/1/2009 UTC");
        timeExtent.endTime = new Date("12/31/2011 UTC");
        timeSlider.setLoop(true);
        timeSlider.setThumbCount(2);
        //timeSlider.setTickCount(dojo.date.difference(timeExtent.startTime,timeExtent.endTime,"Months"));
        // original timeSlider.createTimeStopsByTimeInterval(timeExtent,1,'esriTimeUnitsMonths');
        timeSlider.createTimeStopsByTimeInterval(timeExtent,1,'esriTimeUnitsMonths');
        //timeSlider.createTimeStopsByTimeInterval(timeExtent,1,'esriTimeUnitsYears');
        timeSlider.setThumbIndexes([0,1]);
       // timeSlider.timeStops(3);
        timeSlider.setThumbMovingRate(1000);
        timeSlider.startup();`

Answer 1

Generate your own array of labels, and then specify them on the time slider using TimeSlider.setLabels.

Here's code I put together to do this, use this after you've called timeSlider.startup():

var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
//add labels for every other time stop
var labels = dojo.map(timeSlider.timeStops, function(timeStop,i){ 
  if ( i % 2 ) {
    var m = months[timeStop.getMonth()];
    var y = (timeStop.getFullYear() - 2000);
    var py = (y < 10) ? "0" + y : y;
    var lbl =  m + " " + py;
    console.log("time stop: ", lbl);
    return lbl;
  } else {
    return "";
  }
});     

timeSlider.setLabels(labels);

The code above will label every other tick instead of every tick. Labeling every tick clutters up the bottom of the slider and makes all labels hard to read. This technique is also shown in the Time Slider sample.