A standalone page for this project can be found here: Roseville Traffic Cams Map This project was born from my interest in the increasingly numerous cameras that are present at intersections. After looking to see if there were any web services that provided data for the local community, I was instantly enamored with the 170 PTZ (pan-tilt-zoom) cameras that were reachable by anyone with the URL (currently down). The data was originally scrapped for this web-retro map that appears to have been generated by some Microsoft garbage tool. The bloat of 70,000+ lines of XML proved useful for nothing more than the names and URL’s of the cameras. The Latitude and Longitude were excessively precises (as if someone positioning the icon for optimal map-readability) not to mention that the Latitude and Longitude tags in the XML were flip-flopped, which I am used to dealing with having to validate (my preference is as a region ±x,±y bounding) as the pattern is reliably consistent (America always has a negative Longitude).
The real locations were obtained the hard way; by hand. Using Google Maps I would try determine the location of the camera and the center of the frame. With a small circle physically placed on my screen I was able to consistently identify the approximate GPS coordinates of all 170 cameras. This task was daunting and took a few sessions spread across a number of weeks.
Using Google Spreadsheet as a backend for a simple project like this was a no brainer. I needed the data as a JSON. It would have been nice to structure it better, but for 170 points it is not an issue. Here is the script that I cobbled together from internet knowledge. It used to use jQuery to perform a get request on the spreadsheet, which Google Spreadsheets can generate JSON by simply affixing …. Since the data is static, I saved the JSON directly from google to avoid any changes in code and threw it up in the root directory of my site.
The mapping was trivial with Mapbox. Using Leaflet to place a custom marker that is an eye to identify the camera and the direction it is pointed.
By doing this project I hope I have raised awareness to how cool open data can be when embraced on a large level by the government. The UI was horrible on the original site, so I hope this cleaner way can provide those who are wanting only a clean interface into the cameras, not the original traffic data, a richer experience. People who I have approached for feedback seem a little shocked at the fact that there are 170 cameras that blanket the entire city of Roseville.
Future plans include a better way to place the camera feeds across the entire page. To the point where the limit would be determined by the browsers screen width by height minus the maps width by height. The camera feeds would maintain their size independent of the screen size.