Map control for offline Google Map

2 posts, 0 answers
  1. Vinay
    Vinay avatar
    2 posts
    Member since:
    Aug 2013

    Posted 24 Aug 2013 Link to this post

    Hello Admin and all,
    Can I use the Telerik map control, with one of the providers such as: OpenStreet, Google
    the computer will not be connected to the Internet?
    I have a local server at the site/windows C# net application.
    I have Google map Tile images (256*256 png) with help of GMapCatcher/ Offline Map Maker but I have no Idea how to use and implement with your control.
    Also i am ready to purchase the Paid version of Telerik tool, but i need to sure that's work for me.

    Thank you,
    Vinay Bansal
  2. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 28 Aug 2013 Link to this post

    Hi Vinay,

    I should notice that downloading and using Google map tiles besides the Google services is illegal. It is strongly prohibited by the Google license agreement and we would discourage you from proceeding with this approach.

    It is quite simple to create tile server on localhost when you have images which can be identified by the zoom level and (x,y) position of the tile. All that you need to do is put your tiles in a separate directory in the C:\inetpub\wwwroot folder. So if you have the OpenStreet map tiles organized in a way similar to the structure on the OpenStreet servers (zoom\x_pos\y_pos.png) then you can create tile server on localhost in a couple of steps:

    1. Create new folder like "os_images" in the "C:\inetpub\wwwroot" folder.
    2. Copy whole structure of the OpenStreet images to this new folder.

    Now you can create new map tile source and map provider which will access images from this folder:

    /// <summary>
    /// Tile source which read map tiles from the given URI.
    /// </summary>
    public class LocalhostTileSource : TiledMapSource
    {
        private string tileUriFormat;
       
        /// <summary>
        /// Initializes a new instance of the LocalhostTileSource class.
        /// </summary>
        /// <param name="tileUriFormat">Format string to access tiles on the localhost.</param>
        public LocalhostTileSource(string tileUriFormat)
            : base(1, 20, 256, 256)
        {
            this.tileUriFormat = tileUriFormat;
        }
       
        /// <summary>
        /// Initialize provider.
        /// </summary>
        public override void Initialize()
        {
            // Raise provider intialized event.
            this.RaiseIntializeCompleted();
        }
       
        /// <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)
        {
            int zoomLevel = ConvertTileToZoomLevel(tileLevel);
       
            string url = this.tileUriFormat.Replace("{zoom}", zoomLevel.ToString(CultureInfo.InvariantCulture));
            url = url.Replace("{x}", tilePositionX.ToString(CultureInfo.InvariantCulture));
            url = url.Replace("{y}", tilePositionY.ToString(CultureInfo.InvariantCulture));
            return new Uri(url);
        }
    }
    /// <summary>
    /// Map provider which read map tiles from the file system.
    /// </summary>
    public class LocalhostProvider : TiledProvider
    {
    private MercatorProjection spatialReference;
     
        /// <summary>
        /// Initializes a new instance of the LocalhostProvider class.
        /// </summary>
        /// <param name="tileUriFormat">Format string to access tiles on the localhost.</param>
        public LocalhostProvider(string tileUriFormat)
            : base()
        {
    this.spatialReference = new MercatorProjection();
            LocalhostTileSource source = new LocalhostTileSource(tileUriFormat);
            this.MapSources.Add(source.UniqueId, source);
        }
       
        /// <summary>
        /// Returns the SpatialReference for the map provider.
        /// </summary>
        public override ISpatialReference SpatialReference
        {
            get
            {
                return this.spatialReference;
            }
        }
    }

    Now you can use new map provider in your application:

    <UserControl x:Class="LocalhostMapProvider.MainPage"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 mc:Ignorable="d"
                 d:DesignHeight="300" d:DesignWidth="400">
       
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadMap x:Name="radMap"
                            Center="48.95,2.3"
                            ZoomLevel="13">
            </telerik:RadMap>
        </Grid>
    </UserControl>
    using System;
    using System.Collections.Generic;
    using System.Windows;
    using System.Windows.Controls;
       
    namespace LocalhostMapProvider
    {
        public partial class MainPage : UserControl
        {
            public MainPage()
            {
                InitializeComponent();
       
                this.radMap.Provider = new LocalhostProvider("http://myhost/os_images/{zoom}/{x}/{y}.png");
            }
        }
    }

    The ConvertTileToZoomLevel method is inherited from TiledMapSource class so you do not need to bother about its implementation.

    Regards,
    Andrey Murzov
    Telerik

    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top