window phone7中使用bing中文地圖和Google地圖

之前在windows phone中使用map控件時，一直加載出來的是英文的bing map，一直以爲要等ms提供漢化的map；而同時google和baidu等未發現對應的map sdk或api，那個苦惱啊，使用英文bing map那個痛苦啊；期間看到一些使用加載titlesource 加載google地圖或者bing map中文地圖的方法；但是這些方法都是非正式處理方法，擔心應用發佈後會遇到問題；後來從nokia那得到消息，nokia會出正式的windows phone地圖，但是需要走商業合同... ...，我只整理了下如何加載中文bingmap和google map的方法;源碼

實現的大致思路都是重寫titlesource，在bingmap control中添加一個層，將對應titlesource加載到這個層上顯示；

方法是定義兩個類繼承自Microsoft.Phone.Controls.Maps.TileSource，然後重寫geturl方法；

代碼如下：

View Code

    public class GoogleTitleSource : TileSource    {        public GoogleTitleSource()            : base("http://khm{0}.google.com/kh/v=47&x={1}&y={2}&z={3")        {        }        public override Uri GetUri(int x, int y, int zoomLevel)        {            return new Uri(string.Format(this.UriFormat, x % 4, x, y, zoomLevel));        }    }    public class BingChinaTitleSource : TileSource    {        public BingChinaTitleSource()            : base("http://r2.tiles.ditu.live.com/tiles/r{quadkey}.png?g=4")        {        }    }

再在page loaded事件中添加對應map的層和源

View Code

  private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)        {            //bing            MapTileLayer bingtileLayer = new MapTileLayer();            bingtileLayer.Width = 431;            bingtileLayer.Height = 540;            GeoCoordinate center = new GeoCoordinate(36,104);            TileSource tileSource = new BingChinaTitleSource();            bingtileLayer.TileSources.Add(tileSource);            bingtileLayer.Opacity = 0.9;            bingMap.Children.Add(bingtileLayer);            bingMap.Mode = new MercatorMode();            bingMap.Center = center;            //google            MapTileLayer googletileLayer = new MapTileLayer();            googletileLayer.Width = 431;            googletileLayer.Height = 540;                   TileSource googletileSource = new GoogleTitleSource();            googletileLayer.TileSources.Add(tileSource);            googletileLayer.Opacity = 0.9;            google.Children.Add(googletileLayer);            google.Mode = new MercatorMode();            google.Center = center;            bingEng.Center = center;        }

ui中使用全景視圖，分別添加兩個Map控件

View Code

 <controls:Panorama Grid.Row="1" Height="722" HorizontalAlignment="Left" Margin="0,0,0,0" Title="maps" VerticalAlignment="Top" Width="479" FontSize="26.667" Style="{StaticResource PanoramaStyle1}">        <controls:PanoramaItem Header="Bing Map Chinese" Style="{StaticResource PanoramaItemStyle1}">            <Grid Height="579" Width="434">                <my:Map x:Name="bingMap" Height="578" LogoVisibility="Collapsed" CopyrightVisibility="Collapsed" HorizontalAlignment="Left" Margin="3,1,0,0"                         VerticalAlignment="Top" Width="431" ZoomLevel="3" />            </Grid>        </controls:PanoramaItem>        <controls:PanoramaItem Header="Google Map" Style="{StaticResource PanoramaItemStyle1}">            <Grid Height="578" Width="426">                <my:Map x:Name="google" Height="578" LogoVisibility="Collapsed" CopyrightVisibility="Collapsed" HorizontalAlignment="Left" Margin="3,1,0,0"                    VerticalAlignment="Top" Width="431" ZoomLevel="3" />            </Grid>        </controls:PanoramaItem>        <controls:PanoramaItem Header="bing Map englsh" Style="{StaticResource PanoramaItemStyle1}">            <Grid Height="557" Width="426">                <my:Map x:Name="bingEng" Height="549" ZoomLevel="3" LogoVisibility="Collapsed" CopyrightVisibility="Collapsed" HorizontalAlignment="Left" Margin="3,1,0,0" VerticalAlignment="Top" Width="416" />            </Grid>        </controls:PanoramaItem>    </controls:Panorama>

運行效果

從體驗來說bing中文和google似乎差別不大，但是bing英文 ui顯示元素太少；

來源:http://www.th7.cn/Program/wp7/2012/04/12/69509.shtml