How to draw images (points, lines, polygon, and custom image layers) in DeepEarth)

In the previous article "Basic Framework Model of geometric images in DeepEarth", the basic framework model of the entire DeepEarth is introduced, then, the application example of drawing a triangle demonstrates the application of ry in DeepEarth. This article will continue with this article to introduce the applications of geometric graphics in DeepEarth, including basic graphics (points, lines, polygon) and custom layers.

 

1. Draw a point Layer

First, let's take a look at how to use the PointBase class provided by the basic framework of geometric graphics in DeepEarth to draw a coordinate point on the map. Its usage is very simple, as shown in the following code block (see the code at the end of this article ):

// Create a geometric layer object
Var transformLayer = new GeometryLayer (map)
{
UpdateMode = GeometryLayer. UpdateModes. TransformUpdate,
ID = Guid. NewGuid (). ToString ()
};
Map. Layers. Add (transformLayer );

// Create a vertex object
Var dot = new PointBase ();
Dot. X = 106.5726;
Fig = 29.5627;
Point. Width = 100;
Dot. Opacity = 0.88;
TransformLayer. Add (dot );

 

2. Draw line Layers

Drawing a line is as simple as drawing a point. If you just draw a common line, you can use the LineString object provided by the DeepEarth ry framework to draw the line. The following example code:

Var transformLayer = new GeometryLayer (map)
{
UpdateMode = GeometryLayer. UpdateModes. TransformUpdate,
ID = Guid. NewGuid (). ToString ()
};
Map. Layers. Add (transformLayer );
// Create a line object. The foreground color is yellow and the line width is 2 pixels.
Var line = new LineString (Colors. Yellow, 2 );
// Set the start and end geographic coordinates of the line
Line. Points = new ObservableCollection <Point> ()
{
New Point (104.062021177233, 30.6666587469201 ),
New Point (106.489384971208, 29.5076372217973)
};
// Process mouse events
Line. MouseEnter + = (oo, ee) =>
{
Var l = oo as LineString;
L. LineColor = Colors. Green;
};
Line. MouseLeave + = (mo, me) =>
{
Var l = mo as LineString;
L. LineColor = Colors. Yellow;
};
TransformLayer. Add (line );

 

The above code is very easy to understand. It is to draw lines by specifying the starting and ending geographic coordinate points of the line, and delegate the event processing function for the line mouse event, when the mouse goes through the line, the line color turns Green. When the mouse leaves the line, the line color turns Yellow ).

 

This section describes how to draw a polygon in DeepEarth's basic geometric framework model. Next let's take a look at how to implement a custom graphic layer and add others to DeepEarth for display.

 

3. Custom image Layers 

To implement custom images, we need to understand the PointBase class at one time. It provides a basic element model for point ry, its main feature is to draw a graph based on a geographic coordinate point. To achieve custom image rendering and rendering, we only need to inherit from the PointBase class, and then rewrite its rendering template to achieve the custom image rendering effect, you can dynamically specify different images to achieve different effects. The complete code for the custom image processing class is as follows:

Public class ImageLayer: PointBase
{
Protected Grid RootElement;

Public ImageLayer (Point point)
{
Base. X = point. X;
Base. Y = point. Y;
This. Style = Application. Current. Resources ["ImageLayerStyle"] as Style;
}

Public override void OnApplyTemplate ()
{
Base. OnApplyTemplate ();
This. ImagePath = new BitmapImage (new Uri ("Resources/arrow.png", UriKind. Relative) as ImageSource;
RootElement = GetTemplateChild ("RootElement") as Grid;
}

# Region dependency attributes
/// <Summary>
/// Icon path
/// </Summary>
Public ImageSource ImagePath
{
Get {return (ImageSource) this. GetValue (ImagePathProperty );}
Set {this. SetValue (ImagePathProperty, value );}
}
Public static readonly DependencyProperty ImagePathProperty = DependencyProperty. Register (
"ImagePath ",
Typeof (ImageSource ),
Typeof (ImageLayer ),
New PropertyMetadata (null, new PropertyChangedCallback (delegate (DependencyObject sender, DependencyPropertyChangedEventArgs e)
{
ImageLayer imageLayer = sender as ImageLayer;
(ImageLayer. GetTemplateChild ("imageName") as Image). Source = e. NewValue as ImageSource;
}))
);
# Endregion
}

 

In the preceding custom PointBase extension control, a style named ImageLayerStyle is used to standardize the display method of a directly defined image. The following is the ImageLayerStyle code:

<Style x: Name = "ImageLayerStyle" TargetType = "layer: ImageLayer">
<Setter Property = "Template">
<Setter. Value>
<ControlTemplate TargetType = "layer: ImageLayer">
<Canvas>
<Grid x: Name = "RootElement" MinWidth = "48">
<Grid. RenderTransform>
<ScaleTransform x: Name = "_ ScaleTransform" ScaleX = "1" ScaleY = "1"/>
</Grid. RenderTransform>
<Image x: Name = "imageName" Stretch = "None" Width = "48" Height = "48" HorizontalAlignment = "Center"> </Image>
</Grid>
</Canvas>
</ControlTemplate>
</Setter. Value>
</Setter>
</Style>

 

This completes the development of a custom graphic control. You can use the following code block to use this custom layer:

Var imageLayer = new GeometryLayer (map)
{
UpdateMode = GeometryLayer. UpdateModes. TransformUpdate,
ID = Guid. NewGuid (). ToString ()
};
Map. Layers. Add (imageLayer); // ImageLayer is a custom layer. You can set the loaded image through the template of this control.
Var layer = new ImageLayer (new Point (106.5834, 29.5708 ));
ImageLayer. Add (layer );

 

Through the above series of tossing, the custom layer is successfully applied to the DeepEarth layer and displayed, which only shows the effect; if we want to implement some user interaction operations, we can't do anything about it. We need to add event support for custom layers for corresponding user interaction operations. The customImageLayerIn fact, it is a Silverlight extension Control that indirectly inherits Control. That is to say, a general Silverlight Control has all the behavior characteristics, suchMouseLeftButtonDownAndMouseLeftButtonUpIn addition, you can extend other support for direct-definition events to meet specific requirements. We will not describe the support for extended custom events here.

 

Copyright description

This article is an original article. You are welcome to repost it and indicate the source of the Article. Its copyright belongs to the author and the blog Park.

Author: Beniao

Article Source: http://beniao.cnblogs.com/or http://www.cnblogs.com/