Back in June, the New Jersey DEP Bureau of GIS released the 2007 Land Use/Land Cover data. The data was released in record time, just slightly over 3 years from the aerial photography date. We felt that we needed to release our findings as soon as possible after the release of the data. Before the data was released, John and I began discussing ways that we could make the data presentable to the public in a much more engaging manner than static maps in a PDF report.
While at AAG, John spoke with representatives at Google who were in attendance. They introduced him to the Google Earth plugin and he initially suggested using the plugin for this report. KML supports time-based animation, so it seemed like an easy way to implement animated maps showing the progression of urban growth. John has had success with using animated KML during presentations, but except for a few small examples, we did not use the plugin for anything significant. We developed a few proofs-of-concept, but found that experience was less than stellar. The timeline playback tools seemed to differ between platforms, with some being able to control the speed of the animation and others not. Also, the KMZ files were approximately 6MB per county. At the time, we were only considering hosting it at Rowan and 6MB would have been too much to serve quickly. Using a content-distribution network had not yet occurred to us. Even so, I felt that a 3D interface to view essentially 2D data was probably not the way to go.
I started playing with the idea that we could incorporate animation on a tile-based web map. The tiles themselves could not be animated (as .gifs) as we would have the level of control needed for the animation to work properly. I also did not want to use Flash or Silverlight to power the map. Believe it or not, Flash isn’t installed on everyone’s computer – especially not those in state government. (The ability to access within State Government without the need of plugins was the last nail in the coffin for the GEarth plugin.) The animated maps had to be HTML and JavaScript.
Because of my familiarity with the Google Maps API, I started testing several methods of flipping through a series of tile overlays to get an adequate animation sequence. Even though version 2 is now deprecated, I chose it over 3 again due to my familiarity with 2. I initially constructed four GMapTypes for the four years and used some JS to trigger a switch between maps in sequence. This caused a flicker between frames, as switching between map types causes all of the tiles (Google and ours) to be removed and redrawn. Switching to just the GTileLayer overlay instead creating a series of new GMapTypes removed the flicker, but it comes at the cost of having our overlays on top of the Google layers, instead of sandwiched between the base imagery and Google’s roads and annotation layer. You can see the difference on the Remaining Land map. Those layers are not animated and change only when prompted by the user, allowing us to use custom GMapTypes. Personally, I prefer to have the annotation as the top layer of my map sandwich – it makes the interactive web mapping experience more like reading a conventional map. I am still tinkering with the setup, so if I can get the sandwich to animate, I certainly will.
Tomorrow: Generating & serving 1 million tiles using Geoserver, TileCache and Amazon S3.
Thanks very much guys. Tremendous work. Have you updated the map in this blog post for the 2007 data? … the “NJ land cover change animation” that shows the expanding red development areas? This would be really helpful! Please use the email address I’ve submitted.
Pingback: » Map Example: NJ Land Change Viewer Learn Web Mapping