Symbols and Labels

Download Samples Repository

Description

Shows various types of the more advanced symbol types, such as Composite and CIM symbology.

"Store" "Phone" Available for Store, Phone

Sample Code

<UserControl
	x:Class="ArcGISRuntime.Samples.Desktop.SymbolsAndLabels"
	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/runtime/2013" >

	<UserControl.Resources>
		<!--Composite Symbol mixing simple circle marker with a text-->
		<esri:CompositeSymbol x:Key="NumberedMarkerSymbol1">
			<esri:SimpleMarkerSymbol Size="20" Color="White">
				<esri:SimpleMarkerSymbol.Outline>
					<esri:SimpleLineSymbol Color="CornflowerBlue" Width="3" />
				</esri:SimpleMarkerSymbol.Outline>
			</esri:SimpleMarkerSymbol>
			<esri:TextSymbol Text="1" HorizontalTextAlignment="Center" VerticalTextAlignment="Middle">
				<esri:TextSymbol.Font>
					<esri:SymbolFont FontWeight="Bold" FontSize="14" />
				</esri:TextSymbol.Font>
			</esri:TextSymbol>
		</esri:CompositeSymbol>
		<esri:CompositeSymbol x:Key="NumberedMarkerSymbolA">
			<esri:SimpleMarkerSymbol Size="20" Color="White">
				<esri:SimpleMarkerSymbol.Outline>
					<esri:SimpleLineSymbol Color="Red" Width="3" />
				</esri:SimpleMarkerSymbol.Outline>
			</esri:SimpleMarkerSymbol>
			<esri:TextSymbol Text="A" HorizontalTextAlignment="Center" VerticalTextAlignment="Middle">
				<esri:TextSymbol.Font>
					<esri:SymbolFont FontWeight="Bold" FontSize="14" />
				</esri:TextSymbol.Font>
			</esri:TextSymbol>
			<esri:SimpleMarkerSymbol Size="30" Color="Transparent">
				<esri:SimpleMarkerSymbol.Outline>
					<esri:SimpleLineSymbol Color="#AA000000" Width="1" />
				</esri:SimpleMarkerSymbol.Outline>
			</esri:SimpleMarkerSymbol>
			<esri:SimpleMarkerSymbol Size="40" Color="Transparent">
				<esri:SimpleMarkerSymbol.Outline>
					<esri:SimpleLineSymbol Color="#55000000" Width="1" />
				</esri:SimpleMarkerSymbol.Outline>
			</esri:SimpleMarkerSymbol>
		</esri:CompositeSymbol>

		<esri:CompositeSymbol x:Key="OutlinedAndDashedSymbol">
			<esri:SimpleLineSymbol Width="7" Color="CornflowerBlue" />
			<esri:SimpleLineSymbol Style="Solid" Color="Black" Width="3" />
			<esri:SimpleLineSymbol Style="Dash" Color="White" Width="3" />
		</esri:CompositeSymbol>

		<!--Uses a mix of marker, line and fill symbols to highlight vertices and create an advanced outline-->
		<esri:CompositeSymbol x:Key="VertexFillSymbol">
			<esri:SimpleFillSymbol Color="#44FFFF00">
				<esri:SimpleFillSymbol.Outline>
					<esri:SimpleLineSymbol Width="5" Color="CornflowerBlue" />
				</esri:SimpleFillSymbol.Outline>
			</esri:SimpleFillSymbol>
			<esri:SimpleLineSymbol Style="DashDot" Color="White" Width="3" />
			<esri:SimpleMarkerSymbol Size="8" Color="Red" />
		</esri:CompositeSymbol>
	</UserControl.Resources>

	<Grid>
		<esri:MapView x:Name="MyMapView">
			<esri:Map>
				<esri:ArcGISTiledMapServiceLayer
					ServiceUri="http://services.arcgisonline.com/ArcGIS/rest/services/Canvas/World_Light_Gray_Base/MapServer" />
			</esri:Map>
			<esri:MapView.GraphicsOverlays>
				<esri:GraphicsOverlay ID="labelGraphicsOverlay">
					<esri:GraphicsOverlay.Labeling>
						<esri:LabelProperties IsEnabled="False">
							<esri:AttributeLabelClass TextExpression="[Label]" >
								<esri:TextSymbol Color="Blue" />
							</esri:AttributeLabelClass>
							<esri:AttributeLabelClass TextExpression="[SymbolType] CONCAT NEWLINE CONCAT &quot;ID= &quot; CONCAT [ID]">
								<esri:TextSymbol Color="Black" />
							</esri:AttributeLabelClass>
						</esri:LabelProperties>
					</esri:GraphicsOverlay.Labeling>
				</esri:GraphicsOverlay>
			</esri:MapView.GraphicsOverlays>

		</esri:MapView>

		<Border Background="White" BorderBrush="Black" BorderThickness="1" Margin="30" Padding="20"
				HorizontalAlignment="Right" VerticalAlignment="Top">
			<Border.Effect>
				<DropShadowEffect />
			</Border.Effect>
			<StackPanel>
				<CheckBox x:Name="chkBoxDisplayLabels" Content="Display Labels"
						  IsChecked="{Binding ElementName=MyMapView, Path=GraphicsOverlays[labelGraphicsOverlay].Labeling.IsEnabled, Mode=TwoWay}" />
				<TextBlock Text="Map Rotation" Margin="0,10,5,0" />
				<Slider Minimum="0" Maximum="360"
						ValueChanged="Slider_ValueChanged" />
			</StackPanel>
		</Border>
	</Grid>
</UserControl>
using Esri.ArcGISRuntime.Geometry;
using Esri.ArcGISRuntime.Layers;
using Esri.ArcGISRuntime.Symbology;
using System.Linq;
using System.Windows.Controls;

namespace ArcGISRuntime.Samples.Desktop
{
	/// <summary>
	/// Shows various types of the more advanced symbol types: Composite and CIM symbology.
	/// </summary>
	/// <title>Symbols and Labels</title>
	/// <category>Symbology</category>
	public sealed partial class SymbolsAndLabels : UserControl
	{
		public SymbolsAndLabels()
		{
			this.InitializeComponent();
			CreateGeometries();
		}

		/// <summary>
		/// XAML creation of polygon and polyline geometries are currently not supported, so
		/// here they are created in code. Points are generated in the XAML for this sample.
		/// </summary>
		private void CreateGeometries()
		{
			var gOverlay = MyMapView.GraphicsOverlays["labelGraphicsOverlay"];

			gOverlay.Graphics.Add(new Graphic(new MapPoint(-6000000, 4800000), (Symbol)Resources["NumberedMarkerSymbol1"]));
			gOverlay.Graphics.Add(new Graphic(new MapPoint(-5000000, 3900000), (Symbol)Resources["NumberedMarkerSymbolA"]));
			gOverlay.Graphics.Add(new Graphic(new MapPoint(-4000000, 4800000), (Symbol)Resources["NumberedMarkerSymbol1"]));
			gOverlay.Graphics.Add(new Graphic(new MapPoint(-3000000, 3900000), (Symbol)Resources["NumberedMarkerSymbolA"]));
			gOverlay.Graphics.Add(new Graphic(new MapPoint(-2000000, 4800000), (Symbol)Resources["NumberedMarkerSymbol1"]));
			gOverlay.Graphics.Add(new Graphic(new MapPoint(-1000000, 3900000), (Symbol)Resources["NumberedMarkerSymbolA"]));

			int i = 0;
			foreach (var g in gOverlay.Graphics)
				g.Attributes["Label"] = "Label #" + (++i).ToString();

			Polyline line = new Polyline(FromArray(-100, -30, -80, 0, -60, -30, -40, 0), SpatialReferences.Wgs84);
			var graphic = new Graphic(line, (Esri.ArcGISRuntime.Symbology.Symbol)Resources["OutlinedAndDashedSymbol"]);
			graphic.Attributes["Label"] = "OutlinedAndDashedSymbol";
			gOverlay.Graphics.Add(graphic);

			Polygon polygon = new Polygon(FromArray(-30, -30, 0, -30, 0, 0, -15, -10, -30, 0, -30, -30), SpatialReferences.Wgs84);
			graphic = new Graphic(polygon, (Esri.ArcGISRuntime.Symbology.Symbol)Resources["VertexFillSymbol"]);
			graphic.Attributes["Label"] = "VertexFillSymbol";
			gOverlay.Graphics.Add(graphic);

			//CIM symbols can only be created from JSON. The JSON is currently only constructed by publishing services to ArcGIS Server with advanced symbology
			string CIMSymbolJson = "{\"type\":\"CIMSymbolReference\",\"symbol\":{\"type\":\"CIMLineSymbol\",\"symbolLayers\":[{\"type\":\"CIMFilledStroke\",\"enable\":true,\"effects\":[{\"type\":\"CIMGeometricEffectArrow\",\"geometricEffectArrowType\":\"Block\",\"primitiveName\":null,\"width\":35}],\"capStyle\":\"Round\",\"pattern\":{\"type\":\"CIMSolidPattern\",\"color\":[0,0,0,255]},\"width\":2,\"lineStyle3D\":\"Strip\",\"alignment\":\"Center\",\"joinStyle\":\"Miter\",\"miterLimit\":10,\"patternFollowsStroke\":true}]},\"symbolName\":null}";
			var cimsymbol = Esri.ArcGISRuntime.Symbology.Symbol.FromJson(CIMSymbolJson);
			Polyline line2 = new Polyline(FromArray(20, -30, 30, 0, 50, -30, 70, 0), SpatialReferences.Wgs84);
			graphic = new Graphic(line2, cimsymbol);
			graphic.Attributes["Label"] = "CIM Symbol";
			gOverlay.Graphics.Add(graphic);

			i = 0;
			foreach (var g in gOverlay.Graphics)
			{
				g.Attributes["SymbolType"] = g.Symbol.GetType().Name;
				g.Attributes["ID"] = ++i;
			}
			var symbols = this.Resources.OfType<MarkerSymbol>();
			double x = -7000000;
			foreach (var symbol in symbols)
			{
				Graphic g = new Graphic(new MapPoint(x, 3900000), symbol);
				gOverlay.Graphics.Add(g);
				x += 1000000;
			}
		}

		// Helper method
		private static PointCollection FromArray(params double[] parameters)
		{
			PointCollection coll = new PointCollection();
			for (int i = 0; i < parameters.Length - 1; i += 2)
			{
				coll.Add(new MapPoint(parameters[i], parameters[i + 1]));
			}
			return coll;
		}

		private void Slider_ValueChanged(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e)
		{
			MyMapView.SetRotationAsync(e.NewValue);
		}
	}
}
Feedback on this topic?