How to changethe image on the map while zooming into map

2 posts, 0 answers
  1. Asiq Raja
    Asiq Raja avatar
    30 posts
    Member since:
    Jul 2010

    Posted 27 Oct 2010 Link to this post


              i have a problem, that i can able to place a pushpins in my may with using information layer, and now i want to categorized 2 types.

    1, Area - (have many place, and have to show one image(pushpin, or balloon)
    2. place -(With in the area, and there should be many pushpins)

      now, i showing pushpins in my map, and now when the data load the pushpin will show on the appropriated location, and now i want to change the push pin when the map ll get zoom into the limited zoom level,   show when i  enter the zoomlevel, the pushpins should change. i have try mouse left button clicked event, for while mouse clicking it should change the flag there. 

      Location location = new Location(Convert.ToDouble(listitem.Latitude), Convert.ToDouble(listitem.Longitude));

                        if (radMap1.ZoomLevel == 11)
                             MapPinPoint pinPoint = new MapPinPoint()
                                  ImageSource = new BitmapImage(new Uri("../images/AreaPinpoint.png", UriKind.Relative))
                             MapLayer.SetLocation(pinPoint, location);

    so is this right method , let me know, as soon as possible,

    Thank you
  2. Andrey
    Andrey avatar
    1681 posts

    Posted 29 Oct 2010 Link to this post

    Hi Asiq Raja,

    I'm sorry, I am not sure I can follow you. Do you need to create a pinpoint, put it at the appropriate place, and, then change its appearance (image) depending on the zoom level? If it is so, then you can use ZoomChanged event for this purpose:

    <telerik:RadMap x:Name="radMap" 
        Center="42.7669999748468, 25.2819999307394"
            <telerik:OpenStreetMapProvider />
        <telerik:InformationLayer x:Name="informationLayer" />

    public partial class MainPage : UserControl
        private MapPinPoint pinPoint;
        public MainPage()
            this.pinPoint = new MapPinPoint()
                ImageSource = new BitmapImage(new Uri("/YourApplication;component/images/AreaPushPin.png", UriKind.RelativeOrAbsolute))
            Location location = new Location(42.7669999748468, 25.2819999307394);
            MapLayer.SetLocation(this.pinPoint, location);
        private void ZoomLevelChanged(object sender, EventArgs e)
            if (this.radMap != null)
                if (this.radMap.ZoomLevel < 11)
                    this.pinPoint.ImageSource = 
                        new BitmapImage(
                            new Uri("/YourApplication;component/images/AreaPushPin.png"
                    this.pinPoint.ImageSource = 
                        new BitmapImage(
                            new Uri("/YourApplication;component/images/PlacePushPin.png"

    Or, if you want to have one list of the pushpins for zoom levels < 11, and another set of the pushpins for zoom level >= 11, then you can use ZoomChanged event handler to clear all items from the information layer and show another set of items.

    Kind regards,
    Andrey Murzov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. DevCraft R3 2016 release webinar banner
Back to Top