Ricky's Bing Maps Blog

There is a product called “CloudMade” which gives you the ability to choose amongst a large number of map types that have different skins. You can either create your own skins or use a pre-existing skin from the following page http://maps.cloudmade.com/editor. As cool as this is it would be even cooler if we could do something like this in Bing Maps. This post is going to describe a method that can be used to re-skin the default road tiles from Bing Maps. The idea is to create a service that downloads a tile and uses graphic tools to transform the colors on the tile. This is similar to what was done in the “Dynamic Tile Layers in the Bing Maps Silverlight Control” which can be found here: http://rbrundritt.spaces.live.com/blog/cns!E7DBA9A4BFD458C5!1047.entry.

The first step is to create a service (Generic ASHX handler in this case) that takes in a quadkey, culture and transformation type parameters via a query string. This service will the create a URL to retrieve tiles from Bing Maps. A tile will be downloaded and turned into a bitmap image so that it can be used with .NET graphic tools. For the examples in the demo the ImageAttibutes class is sued to create the transformation. The two key methods used to transform the colors consist of using ColorMatrix or a ColorMap. By using  a color matrix all the colors on the tile can be changed within a couple lines of code. Using a ColorMap allows you to change one color at a time. This is useful if you only want to change a few colors on the map.

In the example application I have showed how to convert the tiles to grey scale, invert the colors, and how to use a custom color map.

Complete source code can be found here: http://cid-e7dba9a4bfd458c5.skydrive.live.com/self.aspx/VE%20Sample%20code/CustomMapTileSkins.zip

To get this code to work you will need to add your Bing Maps API Key to the MainPage.xaml.cs file.

Note that by using this method there is a performance lose as the tiles on the map are no longer being loaded from the Bing Maps cloud but from your tile service.

Here are some screen shots of the different skins used in this code:

Grey Scaled tiles

Inverted Tiles

Custom Color Mapping

Yesterday I was scheduled to present at Microsoft Reading unfortunately things came up at work and I could not attend. A colleague of mine filled in and gave my presentation. For all those who are interested in this presentation the slides, complete source code and database can be downloaded here: http://cid-e7dba9a4bfd458c5.skydrive.live.com/self.aspx/VE%20Sample%20code/Silverlight.DynamicTileLayers.zip

This demo shows how to dynamically create map tiles from raw data that is stored in SQL 2008 and display them in both the Silverlight and AJAX map control.

Steps to get this demo to work:

• Restore database into an SQL 2008 spatially enabled database.
• Create new database user.
• Update database connection string in web.config file.
• Specify your Bing Maps Application ID in the MainPage.xaml.cs file.

Why use dynamic tile layers:

• You can display a much larger amount of data on a map without performance issues.
• Only tiles that have been viewed are rendered.
• If data does not change, caching can be added for better performance.

There are two Bing events coming up that you should attend if you are in the area.

Developing with Bing Maps & Silverlight

Location: Microsoft
              Reading, UK
Date: November 25th, 2009 10am – 4pm GMT

The Bing Maps Platform brings location data to life by making it easier to visualize, understand and analyze. It’s already being used by thousands of governments, companies and organizations worldwide.

This developer focused event will show you how to build well performing and visually engaging web mapping applications using the Bing Maps Silverlight control.

The event will begin with an update, bringing you up to speed with the latest from the Bing Maps platform. The rest of the agenda will cover some of the more standard mapping requirements such as database connections, before diving into the more sophisticated spatial analysis and performance optimization.

The Bing Maps team will be joined by partners Earthware and Infusion Development. Earthware will showcase their development of the Bing Maps World Tour using the Silverlight Control and Windows Azure, whilst Infusion will demonstrate how to create dynamic tile layers in order to visualize large amounts of frequently changing data.

You can register here: http://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032428360&Culture=en-GB

Bing Maps UK User Group – First Meeting

Location: Microsoft London
              100 Victoria Street, London, UK
Date: January 13th, 2010 6pm - 9pm

Our first meeting of the new Bing Maps UK User Group. Open to all newbie's, experienced and Bing maps wizards there should be something for everyone.
We will start informally around 6pm with coffee and socializing and start officially at 7pm finishing up around 9pm and off to the pub. The exact program of sessions etc will be published once we have everything confirmed. If you would like to host a session yourself at this event, or future ones please let us know in the comments below.

The event will focus on developers but any of you marketing and sales types are more than welcome.

Beer and pizza is being kindly donated by Microsoft to let us all relax and unwind.

More information here: http://bingmapsuk.ning.com/events/inaugural-uk-bing-maps-ug

With the official release of the Bing Maps Silverlight control there has been some changes from the CTP version. This article will address the required changes needed to migrate from the CTP version to the production version.

The first change is that the control now requires Silverlight 3. So if you are still using Silverlight 2 you will have to upgrade. You can get the required files to upgrade to Silverlight 3 here: http://silverlight.net/getstarted/

With the production version being released you are now required to authenticate the map. In the CTP version Microsoft took care of the authentication. The Silverlight control does not use tokens like the AJAX control; you can now use an application key. This removes the need to retrieve a client token when you load your map which means faster loading times. To get a key you first need an account. You can get an account here: https://www.bingmapsportal.com. After creating an account you can sign in using your Windows Live ID. Once signed in you can create up to 5 keys by clicking on the Create or view keys on the left side panel. To create a new key, enter the name of your application and the URL which corresponds to the website where the key will be used. Then click the Create key button. Once the key is created you can copy it and use it in your code. There are two ways to add this application id to your code. The first is to set the ApplicationId property of an ApplicationIdCredentialsProvider object and then use this object to set the CredentialsProvider property of the MapBase object. Alternatively you can add the application key to the XAML like so:

You will need to update your Virtual Earth map control assembly reference. The new assemblies have been renamed as well. You will need to replace Microsoft.VirtualEarth.MapControl.dll with both Microsoft.Maps.MapControl.dll and Microsoft.Maps.MapControl.Common.dll.

With the change in assemblies the namespaces have also changed. Here is a mapping of the new namespaces:

The following classes and properties have been removed or modified:

Currently when storing data in the customer service site you have the ability to query your point location data by entity id, property, radius search, and find near route. There are two key search functionalities missing. The first is bounding box searching, and the second is point in polygon searches. A bounding box is simple 4 sided regular polygon and as such if we can perform a point in polygon search we can use the same algorithm to perform a bounding box search. This post is going to outline two methods that can be used to perform such a search against data that is stored in the Customer Service Site.

Method 1

Lets start off with a polygon (blue). If we find the maximum and minimum latitude and longitude coordinates that this polygon has we can create a bounding box (green) that encloses the polygon. We can then calculate the center point and radius from center point to a corner of this bounding box. Once we know this information we can then enclose this bounding box with a circle (red). The information used to create this circle can be used with the radius search tools that are currently available.

If you perform a radius search using the calculated information you will end up with a lot of extra data points. You can filter this data points by running them through a point in polygon algorithm like the one outlined here: http://msdn.microsoft.com/en-us/library/cc451895.aspx. You can then return the filtered data to the user. Using this method your polygon must fit inside a bounding box whose sides are no longer than 353.55 miles. The benefit of this approach is that there are only a few calculations required initially. One down side is that there is a lot of extra data that could be potentially returned.

Method 2

The second method is very similar to the first. The maximum and minimum latitude and longitude coordinates of the polygon are used to create a bounding box so that the center of the polygon can be calculated. However, instead of calculating the radius from the center point to a corner of the bounding box, we can loop through and calculate the radii’s from the center point to each point in the polygon. The largest radius can then be used to perform a radius search.

Using this approach should reduce the amount of data that is returned by radius search as it is able to enclose the polygon tighter than that previous method. The down side is the number of calculations that need to be performed initially. For complex polygons this can result in slower performance. Using this method  you are limited to a maximum radius of 250 miles.

Conclusion

Using either of these methods will allow you to perform both bounding box and point in polygon searches against your data in the customer service site. Which method should you use. If you are performing bounding box searches or are using complex, predefined polygons then the first method would be ideal. If youare letting the user create the polygon chances are there will only be a limited number of points and as such method 2 would be ideal.

I have put together an example that allows you to draw out polygons using the right mouse button (press the left mouse button when done). After you have drawn a polygon you can then use either method to query the FourthCoffeeShops data source. You can down load the sample code here: http://cid-e7dba9a4bfd458c5.skydrive.live.com/self.aspx/VE%20Sample%20code/CSSFindByPolygon.zip