正文

上一节学习了silverlight加载GeoServer发布的WMS地图，这一节学习一下加载GraphicsLayer

一、加载.png或jpg文件图标

1、在MainPage.xaml中添加资源配置

<Grid.Resources>
<esri:SimpleMarkerSymbol x:Key="RedMarkerSymbol" Color="Red" Size="12" />
<esri:SimpleMarkerSymbol x:Key="BlackMarkerSymbol" Color="Black" Size="14" />
<esri:PictureMarkerSymbol x:Key="GlobePictureSymbol" OffsetX="8" OffsetY="8"
Source="images/ttt.png" />
<esri:SimpleLineSymbol x:Key="DefaultLineSymbol" Color="Green" />
<esri:SimpleFillSymbol x:Key="DefaultFillSymbol" Fill="Green" BorderBrush="Blue"
BorderThickness="3" />
</Grid.Resources>

2、在cs文件中添加实现函数（以添加图片图标为例，添加其它请参考api官网）

private static ESRI.ArcGIS.Client.Projection.WebMercator mercator =
new ESRI.ArcGIS.Client.Projection.WebMercator();

private void AddPictureMarkerAndTextGraphics()
{

　　　　GraphicsLayer g = new ESRI.ArcGIS.Client.GraphicsLayer();
for (int i = 0; i < 2; i++)
{
Graphic graphic = new Graphic()
{
Geometry = mercator.FromGeographic(new MapPoint(107.2 + i, 38.1 + i)),
Symbol = LayoutRoot.Resources["GlobePictureSymbol"] as Symbol
};

g.Graphics.Add(graphic);

}
this.myMap.Layers.Add(g);
}

添加System.Runtime.Serialization引用

3、调用AddPictureMarkerAndTextGraphics()

二、加载Graphic点并高亮、闪烁显示

1、实现鼠标触发高亮显示

1.1 在MainPage.xaml中添加资源配置

<esri:MarkerSymbol x:Key="StrobeMarkerSymbol">
<esri:MarkerSymbol.ControlTemplate>
<ControlTemplate>
<Canvas>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="MouseOver">
<Storyboard RepeatBehavior="ForEver">

<DoubleAnimation BeginTime="0"
Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
From="1" To="10" Duration="00:00:01" />

<DoubleAnimation BeginTime="0"
Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
From="1" To="10" Duration="00:00:01" />

<DoubleAnimation BeginTime="0"
Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(UIElement.Opacity)"
From="1" To="0" Duration="00:00:01" />
</Storyboard>
</VisualState>
<!--If normal state is not specified, the animation will
keep going until a mouse out. Keep it empty to transition back to original symbol. -->
<VisualState x:Name="Normal" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<!--Strobe ellipse-->
<!--Note that IsHitTestVisible="False" on the strobe symbol,
so only the static ellipse will trigger mouse over/mouse out-->
<Ellipse Canvas.Left="-5" Canvas.Top="-5"
RenderTransformOrigin="0.5,0.5" x:Name="ellipse"
IsHitTestVisible="False"
>
<Ellipse.RenderTransform>
<ScaleTransform />
</Ellipse.RenderTransform>
<Ellipse.Fill>
<RadialGradientBrush>
<GradientStop Color="#00FF0000" />
<GradientStop Color="#FFFF0000" Offset="0.25"/>
<GradientStop Color="#00FF0000" Offset="0.5"/>
<GradientStop Color="#FFFF0000" Offset="0.75"/>
<GradientStop Color="#00FF0000" Offset="1"/>
</RadialGradientBrush>
</Ellipse.Fill>
</Ellipse>
<!--Static symbol on top-->
<Ellipse Canvas.Left="-5" Canvas.Top="-5"
Fill="#FFFF0000" x:Name="ellipse1"/>
</Canvas>
</ControlTemplate>
</esri:MarkerSymbol.ControlTemplate>
</esri:MarkerSymbol>

1.2 后台代码

Graphic g = new Graphic()
{
Geometry = mercator.FromGeographic(new MapPoint(107.2 , 36.1)),
Symbol = LayoutRoot.Resources["StrobeMarkerSymbol"] as Symbol
};
GraphicsLayer glayer = MyMap.Layers["MyGraphicsLayer"] as GraphicsLayer;
glayer.Graphics.Add(g);

this.myMap.Layers.Add(g);

2、实现直接高亮、闪烁显示

2.1 修改<VisualState x:Name="MouseOver">为：<VisualState x:Name="Normal">

2.1注释<VisualState x:Name="Normal" />为<!--<VisualState x:Name="Normal" />-->