How to changethe image on the map while zooming into map

[Asiq Raja]

Hi,,

          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);
                         this.informationLayer.Items.Add(pinPoint);
                    }

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

Thank you

[Andrey]

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"
    ZoomLevel="6"
    ZoomChanged="ZoomLevelChanged">
    <telerik:RadMap.Provider>
        <telerik:OpenStreetMapProvider />
    </telerik:RadMap.Provider>
    <telerik:InformationLayer x:Name="informationLayer" />
</telerik:RadMap>

public partial class MainPage : UserControl
{
    private MapPinPoint pinPoint;

    public MainPage()
    {
        InitializeComponent();

        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);
        this.informationLayer.Items.Add(this.pinPoint);
    }


    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",
                            UriKind.RelativeOrAbsolute));
            }
            else
            {
                this.pinPoint.ImageSource =
                    new BitmapImage(
                        new Uri("/YourApplication;component/images/PlacePushPin.png",
                            UriKind.RelativeOrAbsolute));
            }
        }
    }
}

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