Microsoft Virtual Earth Silverlight Map Control (CTP)快速上手

Virtual Earth Silverlight Map Control将Virtual Earth融入了Silverlight，使開發者不必再去使用大量麻煩的Javascript API來開發Virtual Earth應用了。除此之外，它還具有以下優點：

對資料和地圖進行動畫開發；

可縮放的界面，包括将來的移動版；

深入整合視訊、音頻和圖像，不僅僅是彈出層；

支援自定義主題的地圖控件；

跨浏覽器支援，不再需要考慮 CSS Hack 和跨浏覽器的 JavaScript 問題。

這個控件的應用非常簡單。下面我們就打開Visual Studio 2008,随便試試吧！

第二步：添加對Microsoft.VirtualEarth.MapControl.dll的引用。

Microsoft.VirtualEarth.MapControl.dll位于Virtual Earth Silverlight Map Control (CTP) SDK安裝路徑内。

<a href="https://images.cnblogs.com/cnblogs_com/azure/WindowsLiveWriter/MicrosoftVirtualEarthSilverlightMapContr_C823/%E6%9C%AA%E5%91%BD%E5%90%8D3_2.jpg"></a>

第三步：在Silverlight的MainPage.xaml(2.0中是Page.xaml)中插入地圖控件。

<a></a>

&lt;UserControl x:Class="SilverlightApplication1.Page"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    xmlns:m="clr-namespace:Microsoft.VirtualEarth.MapControl;assembly=Microsoft.VirtualEarth.MapControl"&gt;

    &lt;Grid x:Name="LayoutRoot" Background="White"&gt;

        &lt;m:Map/&gt;

    &lt;/Grid&gt;

&lt;/UserControl&gt;

如果你F5運作它的話，你已經可以看到Virtual Earth地圖呈現在你的Silverlight項目裡了。我們還要做更多。

第四步：拖入一些簡單的控件。

&lt;UserControl x:Class="SLLiveEarthControl.MainPage"

    xmlns:VirtualEarth="clr-namespace:Microsoft.VirtualEarth.MapControl;assembly=Microsoft.VirtualEarth.MapControl"

    Width="700" Height="500"&gt;

        &lt;Grid.RowDefinitions&gt;

            &lt;RowDefinition Height="*" /&gt;

            &lt;RowDefinition Height="40" /&gt;

        &lt;/Grid.RowDefinitions&gt;

        &lt;VirtualEarth:Map x:Name="viewMap" Mode="AerialWithLabels"  Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" Padding="5"

               View="29.544,106.518,0.0000 14.0000 0.0000"  MouseDoubleClick="MapWithImages_MouseDoubleClick" /&gt;

        &lt;StackPanel Orientation="Horizontal" Opacity="0.7" Grid.Column="0" Grid.Row="1" HorizontalAlignment="Center"&gt;

            &lt;Button x:Name="btnNorthAmerica" Click="ChangeMapView_Click" Tag="39.89341,116.33235,0.0000 14.0000 0.0000"

                     Margin="5" Height="20" &gt;

                &lt;TextBlock&gt;北京&lt;/TextBlock&gt;

            &lt;/Button&gt;

            &lt;Button x:Name="btnChengdu" Click="ChangeMapView_Click" Tag="30.67,104.074,0.0000 14.0000 0.0000" Margin="5" Height="20" &gt;

                &lt;TextBlock&gt;成都&lt;/TextBlock&gt;

            &lt;Button x:Name="btnShanghai" Click="ChangeMapView_Click" Tag="31.10,121.411,0.0000 13.0000 0.0000" Margin="5" Height="20" &gt;

                &lt;TextBlock&gt;上海&lt;/TextBlock&gt;

            &lt;Button x:Name="btnVancouver" Click="ChangeMapView_Click" Tag="29.544,106.518,0.0000 14.0000 0.0000" Margin="5" Height="20" &gt;

                &lt;TextBlock&gt;重慶&lt;/TextBlock&gt;

        &lt;/StackPanel&gt;

        &lt;StackPanel Orientation="Horizontal" Opacity="0.9" Grid.Column="0" Grid.Row="2" HorizontalAlignment="Center"&gt;

            &lt;TextBlock Text="輕按兩下地圖可以添加圖釘。               更改經緯度後可點選Fly to換位置. " Padding="5" Foreground="Red"   Width="178"TextWrapping="Wrap"/&gt;

            &lt;TextBlock Text="Latitude: " Padding="12" Foreground="Red" /&gt;

            &lt;TextBox x:Name="txtLatitude" Text=""  Height="20" /&gt;

            &lt;TextBlock Text="Longitude: " Padding="12" Foreground="Red"   /&gt;

            &lt;TextBox x:Name="txtLongitude" Text=""   Height="20"  /&gt;

            &lt;Button x:Name="btnFlyto" Click="btnFlyto_Click" Foreground="Red"  Margin="5" Height="20" &gt;

                &lt;TextBlock&gt;Fly to&lt;/TextBlock&gt;

第五步：寫背景代碼。

using System;

using System.Windows;

using System.Windows.Controls;

using System.Globalization;

using Microsoft.VirtualEarth.MapControl;

using Microsoft.VirtualEarth.MapControl.Design;

using System.Windows.Media;

using System.Windows.Media.Imaging;

namespace SLLiveEarthControl

{

    public partial class MainPage : UserControl

    { 

         LocationConverter locConverter = new LocationConverter();

        // Converts the Button's location Tag to a map view..

        MapViewSpecificationConverter viewConverter = new MapViewSpecificationConverter();

        private MapLayer imageLayer = new MapLayer();

        public   MainPage()

        {

            InitializeComponent();

            viewMap.AddChild(imageLayer);

            viewMap.ViewChangeOnFrame += new EventHandler&lt;MapEventArgs&gt;(viewMap_ViewChangeOnFrame);

            viewMap.AnimationLevel = AnimationLevel.Full;

        }

        private void viewMap_ViewChangeOnFrame(object sender, MapEventArgs e)

            Map map = sender as Map;

            if (map != null)

            {

                MapViewSpecification mapViewSpec = map.View;

                // 根據地圖目前的狀态動态改變txtLatitude和txtLongitude的值

                txtLatitude.Text = string.Format(CultureInfo.InvariantCulture, 

                    "{0:F5}", mapViewSpec.Center.Latitude);

                txtLongitude.Text = string.Format(CultureInfo.InvariantCulture, 

                    "{0:F5}", mapViewSpec.Center.Longitude);

            }

        private void ChangeMapView_Click(object sender, RoutedEventArgs e)

            viewMap.View = (MapViewSpecification)viewConverter.ConvertFrom(((Button)sender).Tag);

        private void MapWithImages_MouseDoubleClick(object sender, MapMouseEventArgs e)

            e.Handled = true;

            Location pinLocation =  viewMap.ViewportPointToLocation(e.ViewportPoint);

            Image pin = new Image();

            Random r = new Random();

            pin.Source = new BitmapImage(new Uri(r.Next() % 2==0 ? "female.png" : "male.png", UriKind.RelativeOrAbsolute));

            pin.Stretch = Stretch.None;

            imageLayer.AddChild(pin, pinLocation, PositionMethod.BottomCenter);

        private void btnFlyto_Click(object sender, RoutedEventArgs e)

            viewMap.View = new MapViewSpecification(new Location(Double.Parse(txtLatitude.Text), Double.Parse(txtLongitude.Text)), 14);

    }

}

你可能已經注意到，我們在程式設計時已經完全脫離了Javascript；Virtual Earth在我們的手中，已經變得和TextBox,DataGrid一樣，隻是一個控制非常友善的控件了。 : )

本文轉自 流牛木馬 部落格園部落格，原文連結：http://www.cnblogs.com/azure/archive/2009/03/29/1424408.html，如需轉載請自行聯系原作者