[Silverlight] Bing Map 超簡單版搜尋

2010/08/09

這篇文章,是做很簡單的搜尋..
不包含Business 或是 Geocode 的搜尋..
因為重點是簡單快速可使用為主..
首先在XMAL 中加入Map 及兩個MapLayer 以及搜尋和輸入地名的Textbox


   1: <Grid x:Name="LayoutRoot" Background="White">
   2:         <m:Map x:Name="myMap" CredentialsProvider="AhkMeJNiD6a8JSGoC2QIHe47XzBhLqzH_y34nDsbv5kIEbBrEZ9WY_hG4x1DZnd-" 
   3:                Mode="Road" LogoVisibility="Collapsed" >
   4:             <m:MapLayer x:Name="SearchResultLayer"/>
   5:             <m:MapLayer x:Name="PinLayer"/>
   6:         </m:Map>
   7:         <TextBox Height="29" FontSize="14" FontFamily="微軟正黑體" 
   8:                  HorizontalAlignment="Left" Margin="33,70,0,0" Name="txtPlace" VerticalAlignment="Top" 
   9:                  Width="252" Text="台北" />
  10:         <Button Content="搜尋" Height="23" FontSize="14" 
  11:                 FontFamily="微軟正黑體"  HorizontalAlignment="Left" Margin="210,105,0,0" 
  12:                 Name="btnSearch" VerticalAlignment="Top" Width="75" Click="btnSearch_Click" />
  13:     </Grid>

使得畫面如下:
sshot-30

ps. 如果您對於如何在Silverlight 中加入 Bing Map Control 又問題,可以參考 這裡

接下來…

您得先加入SearchService

sshot-31 

在方案管理員的 Service References 案滑鼠右鍵選擇 Add Service Reference

sshot-29

在 Address 的地方輸入…
http://dev.virtualearth.net/webservices/v1/searchservice/searchservice.svc/mex

選擇Go 之後按下OK..

這時候右邊的方案管理員應該會長這樣..

sshot-32

這時候可以來寫程式摟..^^

首先我們先把pin(標示點) 的function 先寫好..

這邊提供兩個function ..

在PinLayer加入pin

Code :
private void AddPintoPinLayer(double la, double lo)
{
Pushpin pin = new Pushpin();
//在MapLayer加入pin並且標記位置
PinLayer.AddChild(pin, new Location(la, lo));
}





清除 PinLayer Code :

   1: private void ClearPinLayer()
   2: {
   3:     this.PinLayer.Children.Clear();
   4: }

ps.如何在Bing Map 中加入Pushpin 可以參考 這一篇

接下來就是 按下搜尋按鈕的時候的Code :

   1: private void ExcuteSearch(string queryPlace)
   2: {
   3:     //初始化Search Service
   4:     SearchServiceClient searchServiceClient = new SearchServiceClient();
   5:     //加入非同步化的完成事件
   6:     searchServiceClient.SearchCompleted += searchServiceClient_SearchCompleted;
   7:  
   8:     //搜尋參數
   9:     SearchService.SearchRequest request = new SearchRequest();
  10:     request.Query = queryPlace;
  11:  
  12:     var credentials = new Credentials();
  13:     //認證的Token
  14:     credentials.Token = "AhkMeJNiD6a8JSGoC2QIHe47XzBhLqzH_y34nDsbv5kIEbBrEZ9WY_hG4x1DZnd-";
  15:     request.Credentials = credentials;
  16:  
  17:     //啟動搜尋
  18:     searchServiceClient.SearchAsync(request);
  19: }

搜尋成功的事件:

   1: void searchServiceClient_SearchCompleted(object sender, SearchCompletedEventArgs e)
   2:         {
   3:  
   4:             if (e.Result.ResultSets.Count > 0)
   5:             {
   6:  
   7:                 if ((e.Result.ResultSets[0].SearchRegion != null))
   8:                 {
   9:                     LocationRect boundingArea = e.Result.ResultSets[0].SearchRegion.BoundingArea as LocationRect;
  10:                     ClearPinLayer();
  11:                     AddPintoPinLayer(boundingArea.Center.Latitude, boundingArea.Center.Longitude);
  12:                     myMap.SetView(new LocationRect(boundingArea));
  13:                 }
  14:                 else
  15:                 {
  16:                     MessageBox.Show("很抱歉,我看不懂,是否可輸入英文別名,讓我更精確搜尋");
  17:                 }
  18:             }
  19:         }

範例:


讚一下:

;
範例下載:


0 意見:

程式 . 生活 . D小調.@2010 | Binary Design: One Winged Angel.