Using the RadMap control with custom OpenStreetMaps tile server

5 posts, 0 answers
  1. Tony
    Tony avatar
    111 posts
    Member since:
    May 2011

    Posted 23 Jan 2015 Link to this post

    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.
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 26 Jan 2015 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for WPF is Visual Studio 2017 Ready
  4. Tony
    Tony avatar
    111 posts
    Member since:
    May 2011

    Posted 27 Jan 2015 in reply to Petar Mladenov Link to this post

    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>
  5. Tony
    Tony avatar
    111 posts
    Member since:
    May 2011

    Posted 27 Jan 2015 in reply to Tony Link to this post

    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?
  6. Tony
    Tony avatar
    111 posts
    Member since:
    May 2011

    Posted 28 Jan 2015 in reply to Tony Link to this post

    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.
Back to Top
UI for WPF is Visual Studio 2017 Ready