Data

Microsoft Silverlight will reach end of support after October 2021. Learn more.

Gets or sets a Geometry that specifies the shape to be drawn.

<object>
  <object.Data>
    simpleOrCompositeGeometry
  </object.Data>
</object>
-or-
<object Data = "inlinePathSyntax" .../>

value = object.Data
object.Data = value

XAML Values

Value	Description
simpleOrCompositeGeometry	A single object element that derives from Geometry. This can be one of the following: One of the simple geometries EllipseGeometry, LineGeometry, or RectangleGeometry. A single GeometryGroup, which supports other geometries as child elements. See the "XAML Values" section in the GeometryGroup reference topic. A PathGeometry, which supports child object elements that establish a path geometry object model of figures and segments. See the "XAML Values" section in the PathGeometry reference topic.
inlinePathSyntax	See Path Markup Syntax.

Property Value

Type: Geometry

A description of the shape to be drawn.

This property is read/write. The default value is null.

Managed Equivalent

Data

Remarks

For documentation on the XAML string format to use for inlinePathSyntax, see Path Markup Syntax (Silverlight 1.0).

To draw simple shapes, use the EllipseGeometry, LineGeometry, and RectangleGeometry objects. To draw curves, arcs, or complex shapes, use the PathGeometry object. To create a composite geometry, use a GeometryGroup object.

Because a GeometryGroup is itself a Geometry, you can specify either single geometries or multiple geometries to populate the <Path.Data> property element in XAML. In the single geometry case, there will be no GeometryGroup collection, and the value of Data will be the single geometry. If you specify multiple geometries, the value of Data will be a GeometryGroup whose Children (GeometryGroup) contain the geometries defined as child elements in XAML.

Example

The following example uses a Path to draw an ellipse.

<Canvas  
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"> 
  
  <Path Fill="Gold" Stroke="Black" StrokeThickness="1">
    <Path.Data>
      <EllipseGeometry Center="50,50" RadiusX="50" RadiusY="50" />
    </Path.Data>
  </Path> 
</Canvas>

The following illustration shows the rendered Path.

Rendered path

In XAML, you may also use a special abbreviated syntax as the value for the Data property. The following example uses this abbreviated syntax to specify the shape of a Path.

<Canvas 
  xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation" 
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">
  
  <Path Stroke="DarkGoldenRod" StrokeThickness="3"
    Data="M 100,200 C 100,25 400,350 400,175 H 280" />
</Canvas>

The following illustration shows the rendered Path.

Path illustration

The Data attribute string begins with the "move to" command, indicated by M, which establishes a starting point for the path in the coordinate system of the Canvas. Path data parameters are case-sensitive. The capital M indicates an absolute location for the new current point. A lowercase m would indicate relative coordinates. The first segment is a cubic Bezier curve that begins at (100,200) and ends at (400,175), and is drawn by using the two control points (100,25) and (400,350). This segment is indicated by the C command in the Data attribute string. Again, the capital C indicates an absolute path; the lowercase c would indicate a relative path.

The second segment begins with an absolute horizontal "line to" command, indicated by H, which specifies a line that is drawn from the preceding subpath's endpoint (400,175) to a new endpoint (280,175). Because it is a horizontal "line to" command, the value specified is an x-coordinate.

For the complete path syntax, see Path Markup Syntax. Note that the Path Markup Syntax topic is written primarily for users of the managed API, and may not have code examples or specific information that address the JavaScript API scenarios.

Applies To

Path

See Also

Reference

PathGeometry