相信大家知道 Windows phone 8 设备家族中非常耀眼的一款是 Nokia Lumia 920 但是有一点同学们未必知道知道 Nokia除了是老牌手机硬件厂商之外，Nokia的地图服务也是非常牛气的。 目前雅虎等网站已经完全采用Nokia地图库，而且windows phone 中的bing地图也在移植Nokia 地图库， windows phone 8 中已经原生集成Nokia 地图控件，那么今天我给大家介绍一下 windows phone 8 中的Nokia地图控件。

此文是 升级到WP8必需知道的13个特性 系列的一个更新 希望这个系列可以给 Windows Phone 8开发者带来一些开发上的便利。

同时欢迎大家在这里和我沟通交流或者在新浪微博上 @王博_Nick

首先介绍下使用步骤使用Nokia地图控件和在WP7中使用BingMap十分相似 这里我选择了 location 和 Map 原因是我想在地图上显示我的本地位置。

另外每一款Nokia地图应用都需要 在应用中指定你的 ApplicationID 和 AuthenticationToken这两项需要在DEV Center中获取

 

当然在App中是要指定一下的

 
  
  1. private void myMapControl_Loaded(object sender, RoutedEventArgs e) 
  2. { 
  3.     Microsoft.Phone.Maps.MapsSettings.ApplicationContext.ApplicationId = "ApplicationID"; 
  4.     Microsoft.Phone.Maps.MapsSettings.ApplicationContext.AuthenticationToken = "AuthenticationToken"; 
  5. } 
 
  
在我们的页面中添加一个地图控件
 
  
 
  
  1. <!--ContentPanel - place additional content here--> 
  2. <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 
  3.     <maps:Map x:Name="MyMap"  Center="39.92, 116.46" ZoomLevel="10"/> 
  4. </Grid> 
 
  
 
  
  1. public MainPage() 
  2. { 
  3.    InitializeComponent(); 
  4.    Map MyMap = new Map(); 
  5.    ContentPanel.Children.Add(MyMap); 
  6. } 
 
  
以上两段代码基本是等效的，但是细心的同学肯定注意到了 XAML文件中指定两个属性值 Center 和 ZoomLeve  Center是指地图所在中心点的经纬度位置，zoomlevel 是用来设置地图的缩放级别（1-20）缩放级别越高 地图的分辨率也就对应越高。
 
  
 
  
  1. public MainPage() 
  2. { 
  3.    InitializeComponent(); 
  4.    Map MyMap = new Map(); 
  5.  
  6.    //Set the Map center by using Center property 
  7.    MyMap.Center = new GeoCoordinate(47.6097, -122.3331); 
  8.  
  9.    //Set the map zoom by using ZoomLevel property 
  10.    MyMap.ZoomLevel = 10; 
  11.    ContentPanel.Children.Add(MyMap); 
  12. } 
 
  
 
  
除了 Center 和 ZoomLevel 还有heading 和 pitch 属性可以对地图属性进行设置
 
  
heading 是标志地图的"指向“ 介于 0 - 360 默认 0 北向上
 
  
 
  
pitch 是标志地图的倾斜度 0 - 180
 
  
 
  
 
  
  1. void OnCenterZoom_Click(object sender, EventArgs args) 
  2. { 
  3.    MyMap.Center = new GeoCoordinate(47.6097, -122.3331); 
  4.    MyMap.ZoomLevel = 18; 
  5. } 
  6.  
  7. void OnAnimate_Click(object sender, EventArgs args) 
  8. { 
  9.    MyMap.SetView(new GeoCoordinate(47.6097, -122.3331), 15, MapAnimationKind.Parabolic); 
  10. } 
 
  
其次地图又分为几种视图模式
 
  
 
  
 
  
  1. void Road_Click(object sender, EventArgs args) 
  2. { 
  3.    MyMap.CartographicMode = MapCartographicMode.Road; 
  4. } 
  5.  
  6. void Aerial_Click(object sender, EventArgs args) 
  7. { 
  8.    MyMap.CartographicMode = MapCartographicMode.Aerial; 
  9. } 
  10.  
  11. void Hybrid_Click(object sender, EventArgs args) 
  12. { 
  13.    MyMap.CartographicMode = MapCartographicMode.Hybrid; 
  14. } 
  15.  
  16. void Terrain_Click(object sender, EventArgs args) 
  17. { 
  18.    MyMap.CartographicMode = MapCartographicMode.Terrain; 
  19. } 
 
  
还有一个比较任性话的设置 地图颜色设置
 
  
 
  
 
  
  1. void Light_Click(object sender, EventArgs args) 
  2. { 
  3.    MyMap.ColorMode = MapColorMode.Light; 
  4. } 
  5.  
  6. void Dark_Click(object sender, EventArgs args) 
  7. { 
  8.    MyMap.ColorMode = MapColorMode.Dark; 
  9. } 
 
  
这里再向大家介绍一下 ，在地图应用中通常标注位置的方法或路径 我们会做一张图片或者一个UI控件，在此我告诉大家在 Nokia Map中如何添加一个UIElements或是一个定义控件。
 
  
第一 在Nokia 地图上显示 自定义控件/UIElements 是通过 MapOverlay 作为介质呈现的
 
  
第二 MapOverLay是要放在 MapLayer中 作为一个Item添加到 Nokia Map的Layer中去的
 
  
 
  
  1. MapOverlay MyOverlay = new MapOverlay(); 
  2. MyOverlay.Content = GetGrid(); 
  3. MyOverlay.GeoCoordinate = new GeoCoordinate(CurrenLocation.Latitude, CurrenLocation.Longitude); 
  4. MyOverlay.PositionOrigin = new Point(0, 0.5); 
  5. MapLayer MyLayer = new MapLayer(); 
  6. MyLayer.Add(MyOverlay); 
  7. MyMap.Layers.Add(MyLayer); 
 
  
 
 
  
以上代码实际上我是在地图中添加了 一个GetGrid 函数返回值。
 
  
 
  
  1. Grid GetGrid() 
  2.         { 
  3.             Grid MyGrid = new Grid(); 
  4.             MyGrid.RowDefinitions.Add(new RowDefinition()); 
  5.             MyGrid.RowDefinitions.Add(new RowDefinition()); 
  6.             MyGrid.Background = new SolidColorBrush(Colors.Transparent); 
  7.  
  8.             //Creating a Rectangle 
  9.             Rectangle MyRectangle = new Rectangle(); 
  10.             MyRectangle.Fill = new SolidColorBrush(Colors.Black); 
  11.             MyRectangle.Height = 20; 
  12.             MyRectangle.Width = 20; 
  13.             MyRectangle.SetValue(Grid.RowProperty, 0); 
  14.             MyRectangle.SetValue(Grid.ColumnProperty, 0); 
  15.  
  16.             //Adding the Rectangle to the Grid 
  17.             MyGrid.Children.Add(MyRectangle); 
  18.  
  19.             //Creating a Polygon 
  20.             Polygon MyPolygon = new Polygon(); 
  21.             MyPolygon.Points.Add(new Point(2, 0)); 
  22.             MyPolygon.Points.Add(new Point(22, 0)); 
  23.             MyPolygon.Points.Add(new Point(2, 40)); 
  24.             MyPolygon.Stroke = new SolidColorBrush(Colors.Red); 
  25.             MyPolygon.Fill = new SolidColorBrush(Colors.Red); 
  26.             MyPolygon.SetValue(Grid.RowProperty, 1); 
  27.             MyPolygon.SetValue(Grid.ColumnProperty, 0); 
  28.  
  29.             //Adding the Polygon to the Grid 
  30.             MyGrid.Children.Add(MyPolygon); 
  31.  
  32.             return MyGrid; 
  33.         } 
 
  
当然这个函数只是一个参考这里可以返回任意的 UI自定义控件只要是基于UIElements即可。
 
  
 好了今天就先给大家介绍这么多 后面我会在用一篇来介绍，如何实现基于定位的后台应用程序，欢迎大家在这里和我沟通交流或者在新浪微博上 @王博_Nick