It has been awhile since I had time to post here. Ive been busy on a whole raft of POCs using Silverlight Map Control. Silverlight seems to be a popular way to add map services to enterprise applications, at least it is generating a lot of POC traffic. Most are impressed with its flexibility. Today I wanted to take a couple of minutes and share a peek at a fun project I was working on in between real work. Its a tracking application with a Twitter twist. The vehicle tracking is tied into a Tweet community along a vehicle route.
DotNet Rocks is an online radio type show that does interviews with technical folks. They are primarily interested in .NET topics so you won’t find a lot of open source, or even GIS for that matter. Along with the recent release of Visual Studio 2010 and Silverlight 4, Richard Campbell and Carl Franklin, the hosts of the .NETRocks program, are taking a US tour in an RV. They will be hitting a dozen or so major cities around the country while doing their show on the road. They just had a stop in Phoenix last night and as I write this are heading out to Houston.
The DNR RoadTrip project uses a SQL Server 2008 DB for maintaining the GPS history and caching Tweets. On the server we have a couple of one minute polling services that check for any new GPS positions or Tweets. There are some static FixedLocation Feeds that maintain venue locations. The GPS track feeds go into the DB directly. The Tweet feeds often have no geo tags so their datetime stamps are used to look up the GPS record closest in time. The location of that GPS position is then applied to the Tweet record location. Here is an edmx view of the DB, but notice geography data types are still not supported so the Location field is missing.
Fig 3 – .edmx view of the DB (does not show geography Location field)
Fig 4 – MSSMS Database Diagrams (shows Location geography field)
The Tweet feeds are queried by the polling service using a #hashtag Twitter search. The hashtag for this Road Trip project, #dnr_roadtrip, lets anyone interested conversevia twitter. The first Tweet at a track location is available as a rollover. If additional Tweets come in at the same location they are made available by an additional Feed Service call:
// Pull the ATOM feed from the Twitter API using the TweetSharp.com library.
var search = FluentTwitter.CreateRequest()
.AuthenticateAs("Twitter account", "Twitter key")
.Search().Query()
.ContainingHashTag(TwitterHashTag) // TwitterHashTag set in the config file.
.Since(m_SinceId)
.AsAtom();
The polling service makes use of the “since_id” as a place holder. This way only newer Tweets since the previous since_id need to be processed.
While these polling services are running on the server, the Silverlight Bing Maps UI is communicating with the DB using a straightforward WCF basicHttpBinding. The WCFRoadShow provides the DB queries for populating the UI. There four primary Feed Service WCF calls:
- GetCurrentLocation() – renders the most recent vehicle location
- GetFixedLocation() – renders venue stop icons from the DB
- GetRoute(string updatetype) – renders the GPS tracking icons
- GetTweet()- renders the Tweet icons related to GPS records
There is one additional Feed Service call which is used to return all Tweets at a given location. This last WCF Service call is triggered by a click event from one of the Tweet icons and is the most complex feed query. It makes use of a SQL Server 2008 geography data type proximity search. The returned Tweet Feed records are then used in a Tweet ListBox using Data Binding.
Listtweets = new List (); XNamespace ns = "http://www.w3.org/2005/Atom"; foreach (FeedServiceReference.FeedItem item in e.Result.FeedItems) { if (item.FeedContent != null) { // Note: namespace required // These are the entry xml elements from Twitter // saved in RoadTrip2010 DB as a varbinary FeedItem MemoryStream m = new System.IO.MemoryStream(item.FeedContent); XDocument Xitem = XDocument.Load(m); foreach (var entry in Xitem.Elements(ns + "entry")) { string tweeturi = entry.Elements(ns + "link").ElementAt(0).Attribute("href").Value; string iconuri = entry.Elements(ns + "link").ElementAt(1).Attribute("href").Value; string title = entry.Element(ns + "title").Value; string author = entry.Element(ns + "author").Element(ns + "name").Value; tweets.Add(new TweetItem(tweeturi, iconuri, title, author)); } } } ((ListBox)_LayoutRoot.FindName("twitterItems")).ItemsSource = tweets; ((Border)_LayoutRoot.FindName("twitterPanelBorder")).Visibility = Visibility.Visible;
You can see from the above code snippet that the rss xml feed item for the tweets is returned and then using Binding is attached to a ListBox’s ItemTemplate DataTemplate. This is a handy way of rendering the indeterminate list length of Tweet records found at a given location. Also note from the code snippet that it was necessary to prefix the Atom namespace for accessing feed Elements and Attributes. This is because the returned Atom wrapper was discarded and only entry elements are stored as a varbinary FeedItems.
In addition to the DB Tweet feed cache, I decided to make use of Twitters newer geotagging capabilities. This is still relatively new and not used very frequently, but there is a simple Twitter location query that I hooked to a double click map event:
string twitterurl = "http://search.twitter.com/search.atom?geocode=";
twitterurl += string.Format(CultureInfo.InvariantCulture, "{0,10:0.000000},{1,11:0.000000},
1mi", loc.Latitude, loc.Longitude).Replace(" ", "");
This takes the click map location in latitude longitude and searches for the nearest geotagged Tweets that fall within a 1mi radius.
Adding geotag Tweet queries injects some interest because unrelated geotagged Tweets can be viewed anywhere in the world. It is surprising to me how many people are unabashed about sharing their location with the world. I was also surprised how much street capitalism occupies the lowly Twitter world. Go to any urban area and a few clicks will reveal the whole spectrum of street talk, the good, the bad, and the ugly.
Since a similar Flickr query is available it was simple to add a geotagged Flickr photo query as well. Double clicking on the map will bring up ListBoxes for all Tweets and Flickr photos that are geotagged and fall within 1mile of the click spot.
string flickrurl = "http://api.flickr.com/services/rest/?
format=rest&method=flickr.photos.search&api_key={0}&safe_search=1
&radius_units=mi&radius=20&lat={3,10:0.000000}&lon={4,11:0.000000}";
This Flickr query returns a group of photo xml entries. Each of these have an id that can be use to obtain the actual photo using a second lookup.
string src = “http://farm{0}.static.flickr.com/{1}/{2}_{3}.jpg”;
In both cases the returned entries are used to populate ListBox’s ItemTemplate DataTemplate.
Another interesting aspect of this project is the donation of a PreEmptive’s Dotfuscator. This is an injection type tool for monitoring traffic and obtaining detailed analytics about a UI. The Dotfuscator tool is easy to use, especially since PreEmptive was kind enough to provide a detailed config.xml.
Using the tool creates a new xap file of the UI which holds event triggers for different aspects of the code. These events trigger messages back to the PreEmptive’s Runtime Intelligence Service where they are aggregated and then made available for a nice display. You can click on the PreEmptive icon to take a look at the analytics generated on this project. I was impressed with how easy it was to use and how nice it was to get analytics at a highly granular level, down to clicks on individual elements in the xaml.
Since some interested viewers kept a viewer open I also added a timer refresh to update currentPosition, Tweets, and GPS locations:
- refreshTimer = new DispatcherTimer();
- refreshTimer.Interval = new TimeSpan(0, 0, 0, 0, 120000); // 120000 Milliseconds 2 min
- refreshTimer.Tick += new EventHandler(Refresh_Tick);
- refreshTimer.Start();
The key control for using any of the queries for GPS and Tweets is the DateTime Slider. This is a handy control found over in the DeepEarth codeplex project.
There are plenty of other useful controls available in the DeepEarth Bing Maps Toolkit. This DateSlider encapsulates selection of DateTime ranges across a min/max range:
dateRange.Minimum = DateTime.Parse("4/16/2010 00:00:00", CultureInfo.InvariantCulture);
dateRange.RangeStart = DateTime.Now.AddDays(-2);
dateRange.RangeEnd = DateTime.Now.AddHours(1);
dateRange.Maximum = DateTime.Parse("5/9/2010 00:00:00", CultureInfo.InvariantCulture);
startdatetext.Text = dateRange.RangeStart.ToString();
enddatetext.Text = dateRange.RangeEnd.ToString();
In the process of deploying this project I learned about CultureInfo. Surprisingly, for a RoadTrip in the USA there were a number of folks from other countries who wanted to watch Richard and Carl roam across North America. I had to go back through the application adding CultureInfo.InvariantCulture Globalization to get things to work for the non ‘en-US’ followers. Adjusting for at least working even without fully accommodating other languages turned out to be surprisingly simple. This is one of the pluses for working in the Microsoft world.
Another big plus is browser compatibility. A quick check with browsers I happen to have on hand verified that all of these work fine:
- Firefox v3.0.17
- Chrome 4.1.249.1069
- Safari 4.0.4
- Opera 10.51
- IE of course
Don’t even try this with an SVG project.
Summary
Twitter is fun and Twitter with maps is a GIS social network. Some claimed to find it mildly addicting. The internet world is over flowing with connectable APIs, SDKs, etc and Bing Maps Silverlight makes hooking these all together relatively statraighforward. Remember it’s really just me and a few weeks working part time to put together a pretty interesting Twitter Map. I know there are lots of more sophisticated Twitter mapping applications already floating around, but of course the attraction to Silverlight is ease of ownership.
