This was a great challenge for lesson 5 and I had a lot of fun completing it. As suggested, I first checked out the hurricane map service in ArcMap and identified a segment. I determined that the column, hurricane id (btid) was the hurricane identifier for each hurricane and I made note of the other columns that where needed (cat, track_date, name). I knew I was going to have to perform a query task in JavaScript to get the category 4 and 5 hurricanes, but since the hurricanes are stored in line segments and the service is running on a 10.0 ArcGIS server, I would not be able to use a group by clause in the query task (10.1 will have that functionality which would have made the project a bit easier). Instead, I would have to get all the category 4 and 5 hurricanes and put the unique btid in an array. With the unique btids, I would be able to set a layer definition by btid, and populate the side bar with the unique btids.

I thought I came up with a great approach on my first attempt on this, then I found out the btid is not unique across hurricanes and years. This posed a bit of a challenge to get around. To solve it, I had to set the layer definition on the dynamic service layer to not only btid = n, but also track_date >= 1/1/yyyy and track_date < 1/1/(yyyy + 1). By extending my layer definition to include the track date, I was forced to use a proxy page for the long url that gets sent to the GIS server. Also, the maximum records returned on a query task is set to 1000, so I had to deal with that issue too. I came up with two different methods of achieving my goal.

Version 1: on page load, I performed a query task in ten-year increments (starting with 1861 to 1871 and finishing with 2001 to 2011). I took the unique btid and track_date results and placed the geometry, name, category, btid, and track_date into a global array. I also created a layer definition on the dynamic service layer that includes btid and the tract date range for every hurricane in cat 4 or 5. To make the map less cluttered, I incorporated a time extent with a time slider. With the time slider, the initial years are set to 1861 to 1870. When the user changes the time slider, the export of the map includes not only the time extent, but also the default layer definition. Because the layer definition is so large, there is a bit of a delay in the retrieval of the exported image (1.33ms), but it resolves the 1000 record limit by using the data I have stored in the global array.

Version 2: version 2 takes a similar approach, except the layer definition gets set on every time extent change. After a time extent change, I performed a query task on every category in H4 or H5 and the current time extent. The results from the query allowed me to create a layer definition that is not as large as in version 1 (as long as the time slider is not set to a large time frame), which made the exported map load faster than in version 1. The downside of this approach is a double query. The time slider queries the layer on time extent change, and then I perform an additional query on cat 4 or 5. In some cases, Firebug picks up an xhr cancelled error. Basically, since I am querying the same layer twice at almost the same time, the JavaScript API throws a catchable error stating that the first request has been cancelled. It seems like more of a warning to me, since the functionality is not affected. In some queries, more than 1000 records could be returned and I would not be able to display all the potential records.

Both versions use a basic boarder container layout from a sample template on ESRI's resource center:

ESRI's resource center has a ton of samples that have been very helpful for me in the past. I used the same doctype as in the sample (html 4.01 strict), although the W3 validation service did not like the attributes dojo adds to html elements. Lesson 5 also allowed me to try out a time enabled layer for the first time. To get started on how to properly use the time slider I used this sample:

I contemplated adding clickable graphics of the hurricane tracts to the map, but I decided that adding a segment graphic to the map when the user performs a mouse over on the grid would suffice.