前一篇文章《【Bing Map学习系列】(1)——开发前的准备工作》http://blog.csdn.net/rocket5725/archive/2010/01/14/5188687.aspx介绍了如何搭建Bing Map的开发环境,以及一些准备工作,包括下载相关软件、准备Bing Map Key。
感谢原创作者:http://www.cnblogs.com/beniao/archive/2009/11/24/1608284.html
这个Key是用来做什么的呢?Silverlight控件在做地图呈现的时候它是一个必不可少的参数,可以理解为微软Bing Maps为用户开通的一个授权开发密匙,本文试图通过一个简单的示例演练项目来学习Bing Maps控件如何使用这个Key来显示地图。
1、在Visual Studio 2008 SP1中创建Silverlight Project。创建好的解决方案截图如下:
注意:解决方案包括了BingMaps以及BingMaps.Web,你必须在运行之前将BingMaps设置为启动项目。
2、在弹出【New Silverlight Application】对话框时,必须确保Host the Silverlight application in a new Web site选项是勾选的,因为在Silverlight严格控制URL访问,你的Web页面必须通过HTTP规则才能访问Bing Map。
1、添加相关引用,具体操作如下:
在BingMaps中选择引用->右击添加引用->浏览->找到Bing Maps Silverlight Control SDK的目录下的两个dll文件。分别为:Microsoft.Maps.MapControl.Common.dll和Microsoft.Maps.MapControl.dll,讲这两个库文件都引入到上面所建立的Silverlight项目中。
2、修改MainPage.xaml
然后打开MainPage.xaml的源试图,这是就可以通过名称空间将Bing Maps Silverlight Control引入到当前Silverlight页面,如下代码示例(注意CredentialsProvider的值就是你之前创建的Bing Map Key),同时为了能够显示地图需要添加<m:Map></m:Map>节点的内容。具体代码如下:
<UserControl x:Class="SilverlightApplication1.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:m="clr-namespace:Microsoft.Maps.MapControl;assembly=Microsoft.Maps.MapControl" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"> <Grid x:Name="LayoutRoot"> <m:Map CredentialsProvider="AmreePcQ50WyjCYvxNo0xUQDwiYVM8VFVTxmcW_1RmOb2x_7T1muW-fSTQQkOok1" NavigationVisibility="Collapsed" Width="500" Height="500"> </m:Map> </Grid> </UserControl>
在地图控件(Map)中的CredentialsProvider就是之前我们通过Bing Maps账户管理中心创建的开发所需的Key,通过Width和Height属性值确定地图控件将显示的宽度和高度。编译启动程序预览就可以发现,
警告信息:如果你通过以下方式访问页面信息:
file:///D:/Codes/SilverlightApplication1/SilverlightApplication1/Bin/Debug/TestPage.html
你的页面将会显示:Map loaded in unsupported Url Scheme.Please reload page in "http" scheme
这条信息就是提示你必须通过Http协议才能正常显示你创建的Bing Maps,否则就会出错(所以你的PC最好安装好了IIS,否则直接运行Silverlight项目会提示相关错误信息)。
编译成功后,默认的地图(其他地图的开发在后续blog里会介绍)已经成功的通过Bing Maps Silverlight Control呈现出来了,如下图所示:
在显示默认图像的同时,收到了【中联重科】的录用通知,两者都让我很兴奋啊。我需要冷静一下,等下才写后续的内容了。
冷静回来,继续学习,上面的图片的默认的显示,显然不能满足用户的需要,那么我们如何定制自己需要的图片呢,首先你必须了解相关的属性。
1、NavigationVisibility属性
如地图左上方有地图的导航工具栏,我们可以通过Map控件的NavigationVisibility属性设置是否要显示该功能导航。设置方式如下:
<m:Map CredentialsProvider="AmreePcQ50WyjCYvxNo0xUQDwiYVM8VFVTxmcW_1RmOb2x_7T1muW-fSTQQkOok1" NavigationVisibility="Collapsed" Width="500" Height="500"> </m:Map>
2、 Mode属性
也可以设置地图的显示模式,有路况模式(Road)、卫星模式(Aerial模式分显示路标和不显示路标两种模式),控件默认加载为路况模式,既Road模式,如下代码:
<m:Map CredentialsProvider="AmreePcQ50WyjCYvxNo0xUQDwiYVM8VFVTxmcW_1RmOb2x_7T1muW-fSTQQkOok1" Name="map" Width="500" Height="500" Mode="Road"> </m:Map>
如果设置Mode为“Aerial”则以卫星模式加载地图,Aerial是无路标的卫星模式,若要显示路标则需要使用“AerialWithLabels”加载地图。如下代码:
<m:Map CredentialsProvider="AmreePcQ50WyjCYvxNo0xUQDwiYVM8VFVTxmcW_1RmOb2x_7T1muW-fSTQQkOok1" Name="map" Width="500" Height="500" Mode="AerialWithLabels"> </m:Map>
3、其他的属性
我们还可以为路标设置缓慢效果,当鼠标指向路标的时候缓慢显示出路标,离开后缓慢隐藏路标。代码如下所示:
<m:Map CredentialsProvider="AmreePcQ50WyjCYvxNo0xUQDwiYVM8VFVTxmcW_1RmOb2x_7T1muW-fSTQQkOok1" Name="map" Center="37.806029,-122.407007"> <m:Map.Mode> <m:AerialMode Labels="True" FadingLabels="True" /> </m:Map.Mode> </m:Map>
我们目前只是能够显示地图,然后可以通过一些属性值定制自己的Bing Maps项目。但是我们又面临了新的问题,即我们如何控制地图呢?下一个章节将会给出具体的答案。