Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
375
Showing UserControl on Map?
posted

Is it possible to display a user control on the map coordinates, on a map?  Say, for instance, I wanted to put a UserControl button on capitals of states in the US and if you clicked on the button, a page would load?  Something to place a UserControl onto these coordinates...

Thanks!

Parents
No Data
Reply
  • 3255
    posted

    Hi terinfire,

    you can use SymbolElement to place it at specific coordinates and attach to XamMap's ElementClick. 

    Another approach would be to use MapLayer's ValueTemplate and set its DataTemplate to Button. You will also need to create an attached property for page address since MapElement doesn't provide one.

    In XAML:

    <igMap:XamMap x:Name="xamMap1" ElementClick="xamMap1_ElementClick">
     <igMap:XamMap.Layers>
      <igMap:MapLayer x:Name="MapLayer" IsAutoWorldRect="True" >
       <igMap:MapLayer.Reader>
        <igMap:ShapeFileReader Uri="Shapefiles/usa/usa_st" DataMapping="Name,Caption=STATE_NAME"/>
       </igMap:MapLayer.Reader>            
      </igMap:MapLayer>

      <igMap:MapLayer x:Name="symbolLayer">
       <igMap:MapLayer.ValueTemplate>
        <DataTemplate>
         <Button Content="Click me" Click="Button_Click" />
        </DataTemplate>
       </igMap:MapLayer.ValueTemplate>
      </igMap:MapLayer>

     </igMap:XamMap.Layers>
    </igMap:XamMap>

    In code behind:

    1. Create an attached dependency property to hold page's uri

     #region PageAddress

    public Uri PageAddress
    {
     get { return (Uri)GetValue(PageAddressProperty); }
     set { SetValue(PageAddressProperty, value); }
    }

    public static readonly DependencyProperty PageAddressProperty =
     DependencyProperty.RegisterAttached("PageAddress", typeof(Uri), typeof(ButtonSymbol),
       new PropertyMetadata(null));

    #endregion

    2. Add the button that will open a new page on click. The button is added at specific coordinates. Also set the page address.

    var element = xamMap1.Layers[0].Elements.FindElement("Name", "Montana").ElementAt(0);

    var origin = new Point(element.WorldRect.X + 0.5 * element.WorldRect.Width, element.WorldRect.Y + 0.5 * element.WorldRect.Height);
    var symbolElement = new SymbolElement { SymbolOrigin = origin, SymbolType = MapSymbolType.None, SymbolSize = 10 };

    symbolElement.SetValue(PageAddressProperty, new Uri("http://es.infragistics.com/"));

    xamMap1.Layers[1].Elements.Add(symbolElement);

    Rect worldRect = xamMap1.Layers[1].WorldRect;
    worldRect.Union(symbolElement.WorldRect);
    xamMap1.Layers[1].WorldRect = worldRect;

    3. Handle the button click event

    private void Button_Click(object sender, RoutedEventArgs e){           
     var button = (Button) sender;
     var element = (SymbolElement) (button.DataContext);
     var uri = (Uri)(element).GetValue(PageAddressProperty);

     HtmlPage.Window.Navigate(uri);           
    }

    Regards,

    Ivan Kotev

Children