Dynamic Tile Layers in the Bing Maps Silverlight Control

/ November 26, 2009

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.

dynamicTiles

Related posts

48 thoughts on “Dynamic Tile Layers in the Bing Maps Silverlight Control”

  1. Hi Ricky,

    First of all thanks for the post. My requirement is exactally matches what you did.

    But my problem is I am having the DB constrain. I am allowed to only use Oracle 10g.

    So can you please let me know how to use using Oracle DB the same highlighting all countries in Bing map Silverlight control.

    Thanks in advance..

    Debasis

    Reply

    • Oracle 10g does have support for spatial objects, unfortunately it does not have a set of .NET tools to allow you to handle the data. An alternative is to create stored procedures to query the data and then return well known text for the shapes. You can then parse the well known text and then use that data to generate the map tiles. This would be the closest thing to what is being done in this article.

      Reply

  2. Thanks for your quict reply…

    My doubt is how to strore the shapes data in Oracle. Will use spatial object or any other data type (blob, varchar2 etc.) in table.

    Thanks,
    Debasis

    Reply

  3. Hi Ricky

    Thanks for Great post. but i want to show the state in color for the california.i have already import shap data in the sql data base through shap2sql tool. but not show in the color.please suggest.

    Thanks

    Reply

    • Either set the opacity so that the fill color is transparent, or draw a line rather than a polygon. Alternatively if you don’t have a whole lot of data you can look at using the SQL data connector for Bing Maps.

      Reply

  4. Hey Ricky! This demo is great
    I’m using it, but I had a few problems before I got it running.
    Basically, the problema was when parsing the Latitude and Longitude from the database.
    I have my computer configured in Spanish, and when the numbers were parsed, the parse method ignored the decimal dot.
    To fix, I changed in the class SQLExtensions (project TileRenderService) line number 98 to
    boundary.Add(new Coordinate(double.Parse(point[0], System.Globalization.CultureInfo.InvariantCulture.NumberFormat), double.Parse(point[1], System.Globalization.CultureInfo.InvariantCulture.NumberFormat)));

    Hope this will help someone.

    Thanks for the demo!

    Arturo.

    Reply

    • Thanks for the info. I used to have a bad habit of not using invariant culture. I learnt my lesson witht he Taxi Fare Calculator I built. I’ll try and make future posts support globalization.

      Reply

  6. Thanks, Ricky. But I want to use your demo, Codeplex gives a lot of problems when running in Silverlight 5.0. I tried a lot of things to make it work with Linestrings. I guess I have to create a new stored procedure? I tried to update all boundarys in the sample database to linestrings but that does not work…

    Reply

  7. Richard, I send you an email with a request for update your demo for use with Linestrings. Is this possible for you? Of course I will pay…

    Reply

  8. hi ricky,
    m creating my own bing maps.but m unable to add the layers like street,house…toget my maps work better.plz help me out..that in which way i should get it..these things..

    Reply

  9. For some reason, my ProcessRequest is firing multiple times thus causing my shapes to reload multiple times and slowing my application down. It’s also causing an issue as I am placing random colors into my shapes and they are continuously changing. Any thoughts on why this might be happening?

    Reply

    • It’s processing multiple times as there is likely no caching setup in the demo app. The original demo was based on a situation where the data was constantly changing, as such the tiles needed to constantly be regenerated. Adding a cache header to the response should help out a lot. Take a look at this: http://www.dotnetperls.com/cache-aspnet
      As for the colors, using a random color for the shapes will likely cause mismatches as each tile is unaware of the other. It would be best to either base the color on one of the properties of the shape or to add a property to each shape for the color.

      Reply

      • Yes, I’m basically ordering the zip code shapes by a field associated with the shape. When the field changes, I assign a new random color. I changed the ExtractCountry to include a ref territory and a ref countryColor to assign the color.

      • I do not know if the caching will work. I want the colors/territories to cache but them I’m overlaying dynamic data on top of the map so we can see what territory it is falling under easily. I’ll play around with it thought. Thanks

      • I threw the shapes/colors into a session and I only call my database function if the session is null. This prevents the issue from visually happening at least and as you stated, the tiles aren’t altering colors for the same shape. I had a few instances where they were.

        Is it possible to have an AltText pop up when I mouseover each shape?

      • Hi there. Great stuff here. I’m also finding that ProcessRequest() is being called multiple times. Even on first load, it’s being called 4 times for each tile. Any idea what it could be? Thanks!

      • This is likely due to no caching being set up. The Silverlight control downloads not only the tiles on display but the tiles for the next couple of zoom levels at closer zoom levels for the current map view. This is to make for a smoother transition when zooming. This is how the Silverlight control is designed and unrelated to the dynamic tile service. If you implement caching then a single tile will only be downloaded once. If your data does change frequently a small cache time of a few minutes can usually help.

  10. I want to plot more than 20,000 + pins in Bing Map. I have the database with lat and long value. How can I plot the same using tile server.

    Your help in this regard is deeply appreciated.

    Reply

  11. Hi.
    Just found your solution, thanks for sharing it. I’m needing a tile server for bing maps, just need your quick advice :)
    What do you think, is your solution good to make tiles for around 200.000 polylines, average 5 vertices per line (lets say its gas pipelines spread evenly across all of US)?
    TIA

    Reply

    • This solution can be used for that. I have created a client application recently that had 175,000 high resolution polygons (1000+ vertices each). What I would recommend is picking a maximium zoom level for showing this layer. At zoom level 1 you won’t get much detail out of this data, but at zoom level 7 or 8 it may start to make sense to show the data.

      Reply

  12. Encountering a System.OutOfMemoryException error on the line wkt = wkt.Replace(“POLYGON ((“, “”).Replace(“))”, “”); in the WKTToPolygon function. Anyone else encounter this or know why it would happen?

    Reply

  13. Hi Ricky,

    I can plot 20,000+ points in Bing map. I faced a new issue. It is related to sql server. Error message:

    “The Polygon input is not valid because the ring does not have enough distinct points. Each ring of a polygon must contain at least three distinct points.”

    I used Geography datatype and inserted points in the table.

    I faced this issue when I zoomed the bing map after 17 level.

    Do you have any solution for this?

    Reply

    • You can use the MakeValid method on your ploygon data in the database to fix them, or use 4 points. The 4th point needs to be the same as the first point in a ring or polygon. This is a requirement for Geography data in SQL

      Reply

  14. Looks like Silverlight reference in Silverlight.DynamicTileLayers need to be updated to target Silverlight version 5.

    In addition, if you are using SQL Server Denali you will need to apply this workaround

    http://connect.microsoft.com/SQLServer/feedback/details/685654/invalidcastexception-retrieving-sqlgeography-column-in-ado-net-data-reader

    so that SqlGeometry is loaded using appropriate version of Microsoft.SqlServer.Types library.

    ***

    This is a personal message. Please do not treat it in any other way, be that business, employment or otherwise.

    Reply

  15. Ricky, I have implemented your design however, the page loads extremely slow. I’m coloring in polygons by zip codes. Probably about 60 sections all together that cover the United States. Any suggestions on speeding this up for subsequent requests? I’ve tried adding cache header but that doesn’t seem to help at all.

    Reply

    • The performance will really depend on how complex your polygon data is. If it is high resolution data you will likely find this slow as that would be a lot of data coming from the database. If using a spatial database consider reducing the resolution of the data based on zoom level. If using SQL 2008/2012 or Azure use the Reduce method to reduce the resolution.

      Reply

  16. Hi Ricky,

    i need the exactly what you did but not for countries, i need for us zipcodes,
    where can we get this boundaries data for zip code???
    can you help me in this.

    Reply

    • Add a click event to the map. When a user clicks on it send the coordinates to your server and do an intersection check against your data. This is easy to do if your data is hosted in SQL Server 2008, 2012 or Azure. This will give you the metadata for that location which you can send back and then show in an infobox on the map. Here is a demo app I created a while ago that does this: http://onsbingmapsdemo.cloudapp.net/ Simply zoom in and drag the pushpin over a polygon. You will see it load in metadata for that location on the right side panel. Note that this is on a demo service which may be ideal when you test it. The first call to the service may be a little slow, after that it should be fast.

      Reply

    • Hi Ricky,
      I tried the above link, its not opening.

      I did same thing what you did in this article(Dynamic Tile Layers in the Bing Maps Silverlight Control).
      Its everything works great.

      Now the new requirement is we need to implement one extra thing is that add pushpin and infobox for each layer to the above project.

      Reply

      • Ricky,
        Here I am using visual studio 2010 and SQL 2008 R2.
        At least can you give me clue like how we can pass coordinates to the TileService.ashx file.

  23. Hi ricky, first thanks for mailing,

    I have gone through code,here you are azure,I haven’t understand clearly.
    One thing this code was entirely different than compare to above article, is there any possibility implement my requirement in this above mentioned article.

    Reply

  24. Pingback: Viewing Census Data on Bing Maps - Ricky's Bing Maps Blog - Site Home - MSDN Blogs

Leave a reply to John Cancel reply