How to add MapTips

The Extensible Application Markup Language (XAML) view of an application with MapTips enabled on a Feature layer (which is a type of Graphics layer) is shown in the following code example. The application displays states with a population density of more than 150 people per square mile. For each state, a MapTip showing the state's name and population density is displayed. This topic walks you through how the MapTips shown here are specified. It is assumed that you are already familiar with how to create Maps, Feature layers, and Symbols. Note that no managed .NET code (that is, code-behind) is required beyond what is auto-generated when you create a WPF project.

<Window x:Class="MapTips.MainWindow"
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:esri="http://schemas.esri.com/arcgis/client/2009"
     xmlns:esriSymbols="clr-namespace:ESRI.ArcGIS.Client.Symbols;assembly=ESRI.ArcGIS.Client"
	    xmlns:sys="clr-namespace:System;assembly=mscorlib"
     Title="MainWindow" Height="350" Width="525">
    
					<Grid x:Name="LayoutRoot" Background="White" >
    			<!-- Map Control -->
    			<esri:Map x:Name="Map" Background="White" Extent="-20014711, 15, 1656956, 12175318">
            <esri:ArcGISTiledMapServiceLayer ID="BaseLayer" 
        								Url="http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer" />
            <esri:FeatureLayer ID="MyFeatureLayer"
				Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
				Where="POP07_SQMI > 150"> 
                <esri:FeatureLayer.OutFields>
                    <sys:String>STATE_NAME</sys:String>
                    <sys:String>POP07_SQMI</sys:String>
                </esri:FeatureLayer.OutFields>
                <esri:FeatureLayer.MapTip>
                    <Grid Background="LightYellow">
                        <StackPanel Margin="5">
                            <TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" />
                            <StackPanel Orientation="Horizontal">
                                <TextBlock Text="Population Density (2007): " />
                                <TextBlock Text="{Binding [POP07_SQMI]}" />
                            </StackPanel>
                        </StackPanel>
                        <Border BorderBrush="Black" BorderThickness="1" />
                    </Grid>
                </esri:FeatureLayer.MapTip>
            </esri:FeatureLayer>
         </esri:Map>
    </Grid>
</Window>

The steps that follow walk you through how to specify the MapTips in this application. It is assumed that the Map, base layer, Feature layer, and the symbol used by the Feature layer have already been defined. Note that MapTips can be specified on a Graphics layer in the same way. A Feature layer is used for illustration because it can be populated with feature graphics without the use of managed .NET code.

1. Inside the FeatureLayer element, add an element for the layer's MapTip property. The MapTips definition will be placed inside this element.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

2. Inside the MapTip element, define the container (that is, background) for the MapTip's content. In the code here, a StackPanel and Border inside a Grid is used. This results in a rectangle with a border and margin around the MapTip's content. The background color is specified on the Grid, the margin is specified on the StackPanel, and the border color is specified on the Border. With the container elements configured this way, the MapTip will automatically resize to fit its contents.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

3. Inside the MapTip's StackPanel, add TextBlock to hold the state name.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   				<TextBlock FontWeight="Bold" />
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

4. In the state name TextBlock, specify the Text property. Bind the Text property to the STATE_NAME field.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   				<TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" />
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

5. Add a StackPanel to hold a label and value for the population density. Specify the orientation as Horizontal so the value appears next to the label.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   				<TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" />
   				<StackPanel Orientation="Horizontal">
   				</StackPanel>
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

6. Inside the StackPanel, add a TextBlock for the population density label.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   			<TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" />
   				<StackPanel Orientation="Horizontal">
   					<TextBlock Text="Population Density (2007): " />
   				</StackPanel>
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>
   

7. Add a TextBlock for the population density value. Bind the text to the POP07_SQMI field.
   <esri:FeatureLayer ID="MyFeatureLayer"
   	Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/5" 
   	Where="POP07_SQMI > 150" >
   	<esri:FeatureLayer.OutFields>
   		<sys:String>STATE_NAME</sys:String>
   		<sys:String>POP07_SQMI</sys:String>
   	</esri:FeatureLayer.OutFields>
   	<esri:FeatureLayer.MapTip>
   		<Grid Background="LightYellow">
   			<StackPanel Margin="5">
   				<TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" />
   				<StackPanel Orientation="Horizontal">
   					<TextBlock Text="Population Density (2007): " />
   					 <TextBlock Text="{Binding [POP07_SQMI]}" />
   				</StackPanel>
   			</StackPanel>
   			<Border BorderBrush="Black" BorderThickness="1" />
   		</Grid>
   	</esri:FeatureLayer.MapTip>
   </esri:FeatureLayer>