Using the RadMap control with custom OpenStreetMaps tile server

[Tony]

We were previously using a third-part mapping solution.  We are now developing our own in-house tile server using OpenStreetMaps .  I have to modify my application so it uses the in-house tile server.

My application will have an application setting that will be the base URL for the tile server.  I've replaced the third-party's WPF map control with a RadMap and I've added an OpenStreetMapProvider to my program, but I can't find how to change the URL that the provider uses to query the tile server.  How do I do this?

I'm using UI for WPF Q3 2013.  I can upgrade to a later version if I have to, just let me know.

[Petar Mladenov]

Hello Tony,

You need to implement custom Provider in order to change the default URI RadMap uses to download map images. Basically, you create custom Provider and custom MapTileSource. Override the GetTile method of the MapTileSource in order to provide new URI. 
You can find custom provider exaple in this form thread.

public class LocalhostTileSource : TiledMapSource
{
      ...
/// <summary>
    /// Gets the image URI.
    /// </summary>
    /// <param name="tileLevel">Tile level.</param>
    /// <param name="tilePositionX">Tile X.</param>
    /// <param name="tilePositionY">Tile Y.</param>
    /// <returns>URI of image.</returns>
    protected override Uri GetTile(int tileLevel, int tilePositionX, int tilePositionY)
    {

Please also check our help article for custom map provider.
Regards,
Petar Mladenov
Telerik

 

 

[Tony]

Thanks, I've been able to build a test program that has a base URL property.  I can set the base URL to any URL I want and it generates the correct URIs.  To test it, I used http://a.tile.openstreetmap.org as the base.  Everything works.

I want to configure the RadMap control and the Map Provider in XAML. How do I set the MapProvider's Tile Source in XAML?  I've got something like this right now.

    <telerik:RadMap . . .>
        <telerik:RadMap.Provider>
            <local:MyMapProvider . . . >
                <!-- What do I put here to configure my TiledMapSource?? -->
            </local:MyMapProvider>
        </telerik:RadMap.Provider>
    </telerik:RadMap>

[Tony]

I don't see an EDIT link on my last reply, so I'm replying again to add this note:

To be clear, the base URL is a property contained in the custom TiledMapSource, not the custom MapProvider.  I want to create the TiledMapSource in the XAML and assign it to the MapProvider's MapSources property, but in XAML.

For that matter, do I even need the custom MapProvider?  Or are they supposed to be a matched set?

[Tony]

Nevermind, I got this working.

I created a TiledMapSource propery in the custom MapProvider class:

    public TiledMapSource Source {
        get { return iSource; }
        set {
            if ( iSource != null && MapSources.ContainsKey( iSource.UniqueId ) )
                MapSources.Remove( iSource.UniqueId );
            iSource = value;
            MapSources.Add( iSource.UniqueId, iSource );
        }
    }
    private TiledMapSource iSource;

Then I created my base URL property in the custom TiledMapsource:

    public string BaseURL { get; set; }

Now, I can write XAML that looks like this:

    <telerik:RadMap . . .>
        <telerik:RadMap.Provider>
            <local:MyMapProvider>
                <local:MyMapProvider.Source>
                    <local:MyTiledMapSource BaseURL="http://a.tile.openstreetmap.org/{0}/{1}/{2}.png" />
                </local:MyMapProvider.Source>
            </local:MyMapProvider>
        </telerik:RadMap.Provider>
    </telerik:RadMap>

It all works great.