# Display Shapes
This topic provides information about displaying shapes.
## Content
A user can add various shapes to a map. In maps terminology, a shape is an object, which is tied to a latitude or longitude coordinate on a map. Many shapes are available, such as lines, polygons, circles and rectangles. You can also configure your shapes in a way that users can drag or edit them.
### Adding a Polyline
You can connect geographic coordinates with a polyline by adding a [VectorPolyline](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorPolyline.html) to the [VectorLayer](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorLayer.html) (see [Vector data](/componentone/docs/wpf/online-maps5/kml/vector-data) for more information). In this topic, you will create a 3-point polyline using XAML and code.
**In XAML**
Complete the following steps:
1. Place the following XAML markup between the \ and tags:
```csharp
```
2. Press **F5** to run the project.
**In Code**
Complete the following steps:
1. In XAML view, add *x:Name="C1Maps1"* to the *\* tag so that the object will have a unique identifier for you to call in code.
2. Add the following code beneath the **InitializeComponent()** method:
```csharp
InitializeComponent();
// Create layer and add it to the map
VectorLayer VectorLayer1 = new VectorLayer();
c1Maps1.Layers.Add(VectorLayer1);
// Initial track
Point[] pts = new Point[] { new Point(-80.15,42.12), new Point(-123.08,39.09),
new Point(-3.90,30.85)};
// Create collection and fill it
PointCollection pcoll = new PointCollection();
foreach (Point pt in pts)
pcoll.Add(pt);
// Create a polyline and add it to the vector layer as a child
VectorPolyline VectorPolyline1 = new VectorPolyline();
VectorLayer1.Children.Add(VectorPolyline1);
// Points
VectorPolyline1.Points = pcoll;
// Appearance
VectorPolyline1.Stroke = new SolidColorBrush(Colors.Red);
VectorPolyline1.StrokeThickness = 3;
```
3. Press **F5** to run the project.
**This Topic Illustrates the Following**:
The following image depicts a **C1Maps** control with three geographical coordinates connected by a polyline.
### Polygons
You can connect geographic coordinates with a polygon by adding a [VectorPolygon](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorPolygon.html) to the [VectorLayer](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorLayer.html) (see [Vector Data](/componentone/docs/wpf/online-maps5/kml/vector-data) for more information). In this topic, you will create a 3-point polygon using XAML and code.
**In XAML**
Complete the following steps:
1. Place the following XAML markup between the \and tags:
```xml
```
2. Press **F5** to run the project.
**In Code**
Complete the following steps:
1. In XAML view, add *x:Name="C1Maps1"* to the *\* tag so that the object will have a unique identifier for you to call in code.
2. Add the following code beneath the **InitializeComponent()** method:
```csharp
// Create layer and add it to the map
VectorLayer VectorLayer1 = new VectorLayer();
c1Maps1.Layers.Add(VectorLayer1);
// Initial track
Point[] pts = new Point[] { new Point(-80.15,42.12), new Point(-123.08,39.09),
new Point(-3.90,30.85)};
// Create collection and fill it
PointCollection pcoll = new PointCollection();
foreach (Point pt in pts)
pcoll.Add(pt);
// Create a polygon and add it to the vector layer as a child
VectorPolygon VectorPolygon1 = new VectorPolygon();
VectorLayer1.Children.Add(VectorPolygon1);
// Points
VectorPolygon1.Points = pcoll;
// Appearance
VectorPolygon1.Stroke = new SolidColorBrush(Colors.Red);
VectorPolygon1.StrokeThickness = 3;
```
3. Press **F5** to run the project.
**This Topic Illustrates the Following**:
The following image depicts a C1Maps control with three geographical coordinates connected by a polygon.
### Labels
In this topic, you will add a label to a geographic point – the geographic coordinates of Erie, Pennsylvania (USA) - using a [VectorLayer](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorLayer.html) and a [VectorPlacemark](/componentone/api/wpf/online-maps5/dotnet-api/C1.WPF.Maps/C1.WPF.Maps.VectorPlacemark.html).
**In XAML**
Complete the following steps:
1. Add the following XAML between the \ and tags:
```xml
```
2. Run the project.
**In Code**
1. In XAML view, add x:Name="C1Maps1" to the *\* tag so that the object will have a unique identifier for you to call in code.
2. Add the following code beneath the **InitializeComponent()** method:
```csharp
// Create layer and add it to the map
VectorLayer vl = new VectorLayer();
c1Maps1.Layers.Add(vl);
//Create a vector placemark and add it to the layer
VectorPlacemark vp1 = new VectorPlacemark();
vl.Children.Add(vp1);
// Set the placemark to a set of geographical coordinates
vp1.GeoPoint = new Point(-80.107008, 42.16389);
// Set the placemark's label and properties
vp1.Label = "Erie, PA";
vp1.FontSize = 12;
vp1.Foreground = new SolidColorBrush(Colors.Red);
vp1.LabelPosition = LabelPosition.Center;
```
3. Run the project.
**This Topic Illustrates the Following**:
The following image shows a C1Maps control with the geographic coordinates of Erie, Pennsylvania (USA) labeled.
