Silverlight4下bing map实现鼠标移动时显示地图上的经纬坐标

Silverlight4下bing map实现鼠标移动时显示地图上的经纬坐标,第1张

概述最近在学习Silverlight和bing地图的简单开发.只是做点简单的功能效果. 本人菜鸟入门级,大侠勿笑 环境和用到的工具如下 vs2010  silverlight4  Silverlight 4 toolkit April 2010 Bing Maps Silverlight Control 先贴一下界面的xaml代码.布局随便摆的,界面的布局后面还得多多研究 <UserControl 最近在学习Silverlight和bing地图的简单开发.只是做点简单的功能效果. 本人菜鸟入门级,大侠勿笑

环境和用到的工具如下

vs2010 

silverlight4 

Silverlight 4 toolkit April 2010

Bing Maps Silverlight Control


先贴一下界面的xaml代码.布局随便摆的,界面的布局后面还得多多研究


<UserControl    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    xmlns:d="http://schemas.microsoft.com/Expression/blend/2008"    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"    xmlns:shinyRed="clr-namespace:System.windows.Controls.Theming;assembly=System.windows.Controls.Theming.ShinyRed"    xmlns:System_windows_Controls_Primitives="clr-namespace:System.windows.Controls.Primitives;assembly=System.windows.Controls" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk" xmlns:ee="http://schemas.microsoft.com/Expression/2010/effects" x:Class="SilverlightStudy1.MainPage"    mc:Ignorable="d"    d:DesignHeight="300" d:DesignWIDth="400" MinWIDth="1024" MinHeight="600" xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit" Loaded="UserControl_Loaded" xmlns:my="clr-namespace:Microsoft.Maps.MapControl;assembly=Microsoft.Maps.MapControl">    <toolkit:DockPanel name="RootLayer" WIDth="auto" Height="auto">        <StackPanel x:name="Layouttop" OrIEntation="Vertical" Height="100" VerticalAlignment="top" ScrollVIEwer.HorizontalScrollbarVisibility="auto" toolkit:DockPanel.Dock="top">            <StackPanel.Background>                <ImageBrush ImageSource="/SilverlightStudy1;component/Images/top_pic.png" />            </StackPanel.Background>        </StackPanel>        <GrID name="Center" WIDth="auto" ShowGrIDlines="False" margin="0,2,0" toolkit:DockPanel.Dock="Bottom">            <!-- 定义表格结构 -->            <GrID.RowDeFinitions>                <RowDeFinition Height="*"></RowDeFinition>            </GrID.RowDeFinitions>            <GrID.ColumnDeFinitions>                <ColumnDeFinition></ColumnDeFinition>                <ColumnDeFinition WIDth="auto"></ColumnDeFinition>                <ColumnDeFinition WIDth="3*" MinWIDth="500"></ColumnDeFinition>            </GrID.ColumnDeFinitions>            <Rectangle GrID.Row="0" GrID.Column="0" name="leftPanel" stroke="#FF031011"></Rectangle>            <Rectangle GrID.Row="0" GrID.Column="2" name="rightPanel" stroke="#FF140902"></Rectangle>            <sdk:GrIDSplitter x:name="splitline" GrID.Column="1" HorizontalAlignment="Center" WIDth="6" borderThickness="1" borderBrush="#FF0A0A02" />            <!-- 以下存放内容控件 -->            <shinyRed:ShinyRedtheme GrID.Column="3" Height="auto">                <sdk:TabControl x:name="Tab" WIDth="auto" GrID.Column="2" Height="auto" DataContext="{Binding relativeSource={relativeSource Self}}">                    <sdk:TabItem Content="这里是首页的内容" header="首 页" borderThickness="0" Foreground="White" />                    <sdk:TabItem Content="内容管理页面" header="内容管理" borderThickness="0" Foreground="White" />                    <sdk:TabItem header="地 图" Foreground="White">                        <GrID x:name="MapCanvas" WIDth="auto" Height="auto">                            <GrID.RowDeFinitions>                                <RowDeFinition></RowDeFinition>                            </GrID.RowDeFinitions>                            <GrID.ColumnDeFinitions>                                <ColumnDeFinition WIDth="*">                                </ColumnDeFinition>                                <ColumnDeFinition WIDth="auto"></ColumnDeFinition>                            </GrID.ColumnDeFinitions>                                                        <my:Map x:name="mapone" CredentialsProvIDer="An3GS6Xxqc0vv9sOqv1xpY3bTSKMHsfgMJobV7qgipzukAHWXKIvUtp25OHNX8aG" Center="30.280,114.500" ZoomLevel="9" WIDth="auto" Height="auto" GrID.Row="0" GrID.Column="0" Mode="Road" MouseMove="mapone_MouseMove" DataContext="{Binding Path=Resources.source.Scheme}">                                <!--<my:Map.Children>-->                                    <!-- 在xmal中直接标点 -->                                    <!--<my:pushpin Location="30.111,114.6945"></my:pushpin>-->                                                                        <!-- 在xmal中直接画线 -->                                    <!--<my:Mappolyline stroke="Red" strokeThickness="1" Locations="28.111,114.2232 29.2,114.899 30.12,117.888">                                        </my:Mappolyline>-->                                <!--</my:Map.Children>-->                            </my:Map>                            <StackPanel x:name="mapOperationPanel" OrIEntation="Vertical" WIDth="100" Height="auto" GrID.Row="0" GrID.Column="1" HorizontalAlignment="Right">                                <button x:name="btnEnlage" WIDth="80" Height="24" Content="放大" margin="0,10,0"></button>                                <button x:name="btnDeflation" WIDth="80" Height="24" Content="缩小" margin="0,0"></button>                                <sdk:Label x:name="labtooltip" Content="地图显示模式:" Foreground="Red" margin="5,0" />                                <ComboBox x:name="ddlMapMode" WIDth="90" margin="0,5,0" SelectionChanged="ddlMapMode_SelectionChanged"></ComboBox>                                <sdk:Label Content="纬度:" margin="10,25,0"></sdk:Label>                                <TextBox x:name="txtLat" WIDth="90" Height="23"></TextBox>                                <sdk:Label Content="经度:" margin="10,3,0"></sdk:Label>                                <TextBox x:name="txtLong" WIDth="90" Height="23"></TextBox>                                <button x:name="btnposition" Content="定位" WIDth="80" Height="23" margin="0,0" Click="btnposition_Click"></button>                                <button x:name="btnRegMouseClick" Content="开启标记功能" WIDth="100" Height="23" margin="0,20,0" Click="btnRegMouseClick_Click"></button>                                <button x:name="btnCleanMouseClick" Content="结束标记功能" WIDth="100" Height="23" margin="0,0" Click="btnCleanMouseClick_Click"></button>                            </StackPanel>                                                        <!--- 右键菜单 -->                            <toolkit:ContextMenuService.ContextMenu>                                <toolkit:ContextMenu name="RightKeyMenu">                                    <toolkit:MenuItem header="开启标记功能"></toolkit:MenuItem>                                    <toolkit:MenuItem header="结束标记功能"></toolkit:MenuItem>                                    <toolkit:Separator></toolkit:Separator>                                    <toolkit:MenuItem header="放大"></toolkit:MenuItem>                                    <toolkit:MenuItem header="缩小"></toolkit:MenuItem>                                    <!--MenuItem详细定义格式-->                                    <toolkit:MenuItem x:name="testStyleItem">                                        <toolkit:MenuItem.header>                                            <StackPanel OrIEntation="Horizontal">                                                <!--定义选项前面的小图标-->                                                <Image x:name="itemIco1" WIDth="28" Height="28" Source="/SilverlightStudy1;component/Images/fj.jpg"></Image>                                                <TextBlock Text="测试选项" padding="5"></TextBlock>                                            </StackPanel>                                        </toolkit:MenuItem.header>                                    </toolkit:MenuItem>                                </toolkit:ContextMenu>                            </toolkit:ContextMenuService.ContextMenu>                        </GrID>                                            </sdk:TabItem>                </sdk:TabControl>            </shinyRed:ShinyRedtheme>        </GrID>    </toolkit:DockPanel></UserControl>


小功能一:要求在鼠标在地图上滑动时,显示出鼠标在地图上所处位置的经纬坐标.

我们先在Bing Map控件的元素<Map> 里面添加一个鼠标滑动的事件 .如上代码中,定的事件MouseMove="mapone_MouseMove"   注意:我这里给<Map>元素定了个name,后面要用到的 name="mapone"

事件定好了,我们还要在界面上给一个或两个控件用于显示经纬坐标信息. 我这里是在后台代码中动态添加的几个Label控件.大伙可以自己去工具箱里面拖出来放到界面上.

那现在我们来看看后台代码:

        /// <summary>        /// 鼠标移动事件        /// </summary>        /// <param name="sender"></param>        /// <param name="e"></param>        private voID mapone_MouseMove(object sender,MouseEventArgs e)        {            //获取动态添加的两个Label控件            Label latValue = this.mapOperationPanel.Findname("latX") as Label;            Label longValue = this.mapOperationPanel.Findname("longY") as Label;            //根据鼠标在控件(地图控件mapone)的布局位置来获取鼠标在地图中的位置            Location mapLocation = this.mapone.VIEwportPointTolocation(e.Getposition(this.mapone));            //把得到的经纬度坐标信息显示出来.            latValue.Content = mapLocation.Latitude.ToString();            longValue.Content = mapLocation.Longitude.ToString();        }

就一句代码的事. 最主要的还是Bing Map控件自带的一个方法 VIEwportPointTolocation() 这个方法是接收一个Point类型的参数,这个方法就是根据视口点坐标获取相应的地图坐标;


小功能二:



额... 贴了一大堆乱码,其实就是这么个简单的问题.  不过我个人还是觉得,在这里面写点这样的东东可以让我学得更好.至少写这篇废话前,这问题虽然是实现了,但是还有点小问题,自己绕了点弯子.写的时候就发现代码写的太废话了.

总结

以上是内存溢出为你收集整理的Silverlight4下bing map实现鼠标移动时显示地图上的经纬坐标全部内容,希望文章能够帮你解决Silverlight4下bing map实现鼠标移动时显示地图上的经纬坐标所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1011432.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-22

发表评论

登录后才能评论

评论列表(0条)

保存