龍際夢，蔡中祥，劉宏建，李 欽，樊 江

（1.信息工程大學(xué) 地理空間信息學(xué)院，河南 鄭州 450000）

基于ArcGIS API for Silverlight的Web應(yīng)用初步實現(xiàn)

龍際夢1，蔡中祥1，劉宏建1，李 欽1，樊 江1

（1.信息工程大學(xué) 地理空間信息學(xué)院，河南 鄭州 450000）

介紹了ArcGIS API for Silverlight及相關(guān)概念，舉例說明了Map、Navigation、Draw、MapTip等控件的使用，以及應(yīng)用程序在IIS上的部署方法。

ArcGIS API for Silverlight；WebGIS；RIA；Silverlight；REST；Web應(yīng)用

WebGIS是Internet技術(shù)與GIS相結(jié)合的產(chǎn)物，隨著互聯(lián)網(wǎng)的不斷發(fā)展和GIS 技術(shù)的廣泛應(yīng)用，人們對基于網(wǎng)頁技術(shù)的WebGIS的交互性、視覺效果、響應(yīng)速度以及功能體驗等有了更高的要求。RIA（rich internet applications，富因特網(wǎng)應(yīng)用程序）技術(shù)[1]提供了全新的Web應(yīng)用解決方案，給WebGIS帶來了新的發(fā)展契機，實現(xiàn)了更加直觀有效的應(yīng)用服務(wù)。Flex與Silverlight是目前RIA技術(shù)的主要代表，F(xiàn)lex技術(shù)盡管在一定程度上可滿足現(xiàn)有需求，但存在不支持多線程、學(xué)習(xí)曲線較高、對大數(shù)量傳輸?shù)戎С植蛔愕染窒?。與Flex相比較，雖然Silverlight瀏覽器插件安裝率不及Flash插件，但Silverlight平臺支持更多開發(fā)語言，學(xué)習(xí)成本低，開發(fā)效率高，發(fā)展迅速?；贏rcGIS Server，使用 ArcGIS API for Silverlight可以建立令人賞心悅目的RIA[2,3]。

1 ArcGIS API for Silverlight概述

1.1 ArcGIS Server API

ArcGIS Server可以使用的API有如下6種： .Net Web ADF、Java Web ADF、ArcGIS API for JavaScript、ArcGIS API for Flex、ArcGIS API for Silverlight、ArcObject API。

這6種API都能完成一些常見的功能，但是它們之間存在較大的差別。這6個API可分為兩大類，分別是“服務(wù)器端API”和“客戶端API”。.Net Web ADF、Java Web ADF和ArcObjects API可以算做“服務(wù)器端API”，因為使用這3類API所開發(fā)的程序代碼主要是在服務(wù)器端運行的，而使用ArcGIS API for JavaScript、ArcGIS API for Flex和ArcGIS API for Silverlight開發(fā)的程序代碼主要運行在客戶端的瀏覽器里[4]。

1.2 Silverlight

Microsoft Silverlight是一個跨瀏覽器、跨平臺的插件，為Web生成和提供下一代媒體體驗和豐富的RIA。Silverlight提供靈活的編程模型，并可以很方便地集成到現(xiàn)有的網(wǎng)絡(luò)應(yīng)用程序中。Silverlight可以對運行在Mac或Windows上的主流瀏覽器提供高質(zhì)量視頻信息快速、低成本的傳遞。若要運行 Silverlight Web 應(yīng)用程序，用戶只需要在瀏覽器中安裝一個小插件。

1.3 ArcGIS API for Silverlight的構(gòu)成

ArcGIS API for Silverlight主 要 由Maps、Graphics、Tasks、Toolkit、Access to Silverlight components幾部分組成[5]。開發(fā)者能夠在Silverlight應(yīng)用程序中集成ArcGIS Server和Bing地圖的服務(wù)和功能，利用ArcGIS Server和Bing地圖的資源，如地圖、定位器、地理處理模型和Silverlight組件等，創(chuàng)建交互性和表達性很強的應(yīng)用程序。

1.4 ArcGIS API for Silverlight與REST

REST（representational state transfer，表述性狀態(tài)轉(zhuǎn)移）是一個直觀的架構(gòu)風(fēng)格[6,7]，通過網(wǎng)址提交到Web服務(wù)的請求來創(chuàng)建地圖圖像。REST允許程序在不同計算機上獨立于操作系統(tǒng)或平臺進行通信，通過發(fā)送一個http請求到網(wǎng)址，并獲取某種格式的返回數(shù)據(jù)，支持的格式包括XML或嵌入網(wǎng)址的XML。

Silverlight API負責(zé)客戶端的界面交互、地圖和相關(guān)數(shù)據(jù)的展現(xiàn)，REST API在服務(wù)器端提供GIS服務(wù)。這些REST API是ArcGIS Server軟件已經(jīng)在服務(wù)器端封裝完成的，開發(fā)人員要做的工作是在Silverlight API里面去訪問REST API提供的GIS服務(wù)。

2 ArcGIS API for Silverlight應(yīng)用程序的實現(xiàn)

ArcGIS API for Silverlight的開發(fā)環(huán)境包括配置Silverlight開發(fā)環(huán)境和安裝ArcGIS Silverlight API兩部分。

2.1 Map控件

Map控件是ArcGIS API for Silverlight的核心組件，主要用來展示各種各樣的數(shù)據(jù)，Map控件可與用戶進行交互。ArcGIS API for Silverlight提供了若干種圖層類型來承載不同來源的數(shù)據(jù)，主要分為Map Service Layers、Feature Layers、Graphics Layers 、Element Layers等。其中，Map Service Layers包括如下4種圖層:

1）ArcGIS Tiled Map Service Layer， 是 可 通 過REST接口來訪問的緩存地圖服務(wù)圖層。

2）ArcGIS Dynamic Map Service Layer，是可通過REST接口訪問的ArcGIS動態(tài)地圖服務(wù)圖層。該圖層類型可根據(jù)客戶端請求生成背景透明的實時圖片。

3）ArcGIS Image Service Layer，是可通過REST訪問的ArcGIS影像服務(wù)圖層。

4）Tile Layer，是緩存的微軟Bing地圖服務(wù)圖層。使用該圖層數(shù)據(jù)需提供令牌。

以添加ArcGIS Tiled Map Service Layer為例，XAML關(guān)鍵代碼如下：

〈esri:Map x:Name="MyMap" Extent="-120, 20, -100, 40" 〉

〈esri:Map.Layers〉

〈esri:ArcGISTiledMapServiceLayer ID="StreetMapLayer"

Url="http://server.arcgisonline.com/ArcGIS/rest/ services/ESRI_StreetMap_World_2D/MapServer" /〉

〈/esri:Map.Layers〉

〈/esri:Map〉

運行效果如圖1所示。

圖1 Map控件使用運行截圖

2.2 Navigation控件

Navigation控件即導(dǎo)航條控件，該控件與單個Map控件相關(guān)聯(lián)。提供了地圖的漫游、縮放、重置正北方向以及全圖顯示等功能。

運行效果如圖2所示，XAML關(guān)鍵代碼如下：

〈esri:Navigation HorizontalAlignment="Left" Name="Navigation1" VerticalAlignment="Top" Map="{Binding ElementName=MyMap}"/〉

圖2 Navigation控件使用運行截圖

2.3 Map Tip控件

Map Tip控件可顯示與該控件所關(guān)聯(lián)的Graphics Layer圖層中鼠標(biāo)光標(biāo)所停留位置的元素的屬性。

1）在Feature Layer元素中添加圖層的Map Tip屬性。

〈esri:FeatureLayer ID="MyFeatureLayer"

Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/ services/Demographics/ESRI_Census_USA/MapServer/5"

Where="POP07_SQMI 〉 150" Renderer= "{StaticResource MySimpleRenderer}" 〉

〈esri:FeatureLayer.OutFields〉

〈sys:String〉STATE_NAME〈/sys:String〉

〈sys:String〉POP07_SQMI〈/sys:String〉

〈/esri:FeatureLayer.OutFields〉

〈/esri:FeatureLayer〉

2）在Map Tip元素中，定義一個容器，用來顯示Map Tip的內(nèi)容。

〈esri:FeatureLayer.MapTip〉

〈Grid Background="LightYellow"〉

〈StackPanel Margin="5"〉

〈/StackPanel〉

〈Border BorderBrush="Black" BorderThickness="1" /〉

〈/Grid〉

立足上述立法背景存在的現(xiàn)實需求，以《知識產(chǎn)權(quán)基本法》的指導(dǎo)思想為指導(dǎo)，《知識產(chǎn)權(quán)基本法》立法應(yīng)當(dāng)秉持如下原則。

〈/esri:FeatureLayer.MapTip〉

3）在Map Tip的Stack Panel控件中，添加Text Block用來顯示州名以及人口密度。

〈TextBlock Text="{Binding [STATE_NAME]}" FontWeight="Bold" /〉

〈StackPanel Orientation="Horizontal"〉

〈TextBlock Text="Population Density (2007): " /〉

〈TextBlock Text="{Binding [POP07_SQMI]}" /〉

〈/StackPanel〉

運行效果如圖3所示。

Draw工具提供了在客戶端繪制各種幾何對象的功能。

客戶端XAML關(guān)鍵代碼如下：

〈Grid x:Name="LayoutRoot" Background="White"〉

〈Grid.Resources〉

〈esri:SimpleFillSymbol x:Key="RedFillSymbol" Fill="#66FF0000" BorderBrush="Red" Border Thickness="2" /〉

圖3 MapTip使用運行截圖

〈esri:SimpleFillSymbol x:Key="BlueFillSymbol" Fill="#660000FF" BorderBrush="Blue" Border Thickness="2" /〉

〈/Grid.Resources〉

〈esri:Map x:Name="MyMap" Background="White" Extent="-120, 20, -100, 40" 〉

〈esri:Map.Layers〉

〈esri:ArcGISTiledMapServiceLayer ID= "StreetMapLayer"

Url="http://server.arcgisonline.com/ArcGIS/rest/ services/ESRI_StreetMap_World_2D/MapServer"/〉

〈esri:GraphicsLayer ID="MyGraphicsLayer" /〉

〈/esri:Map.Layers〉

〈/esri:Map〉

〈/Grid〉

后臺C#關(guān)鍵代碼如下：

1）創(chuàng)建一個新的Draw對象：

Draw MyDrawObject = new Draw(MyMap)

{

FillSymbol = LayoutRoot.Resources ["RedFillSymbol"] as FillSymbol

};

MyDrawObject.DrawComplete += MyDrawObject_ DrawComplete;

2）激活Draw工具：

MyDrawObject.DrawMode=DrawMode.Polygon;

MyDrawObject.IsEnabled=true;

3）定義一個Draw事件完成的處理程序：

private void MyDrawObject_DrawComplete(object sender, ESRI.ArcGIS.Client.DrawEventArgs args)

{

Graphic graphic = new Graphic()

{

Geometry = args.Geometry,

Symbol = LayoutRoot.Resources["BlueFillSymbol"] as FillSymbol

};

GraphicsLayer graphicsLayer = MyMap.Layers ["MyGraphicsLayer"] as GraphicsLayer;

graphicsLayer.Graphics.Add(graphic);

}

運行效果如圖4所示。

圖4 Draw工具使用運行截圖

2.5 查詢?nèi)蝿?wù)

查詢?nèi)蝿?wù)允許用戶從ArcGIS Server地圖服務(wù)圖層中通過某些條件過濾來獲取相關(guān)要素，可使用空間范圍或?qū)傩詶l件或兩者組合方式來進行查詢。

這里以查詢美國2007年人口密度大于500人/km2的地區(qū)為例，客戶端XAML關(guān)鍵代碼如下：

〈Canvas HorizontalAlignment="Right" VerticalAlign ment="Top" Margin="0,15,7,0" Width="250"〉

〈Rectangle Fill="#CC5C90B2" Stroke="Gray" RadiusX="10" RadiusY="10" Width="230" Height="55"/〉

〈TextBlock Text="輸入查詢條件并點擊“查詢”按鈕" Foreground="White" FontSize="10" Margin="10,5,0,0"/〉

〈TextBlock x:Name="QueryTextBox" Width="150" Margin="15,22,0,0" Text="POP07_SQMI〉500"/〉

〈Button x:Name="QueryButton" Content="查詢" Margin= "168,23,0,0" Click="QueryButton_Click"/〉

〈/Canvas〉

后臺C#關(guān)鍵代碼如下：

private void QueryButton_Click(object sender, RoutedEventArgs e)

{

//初始化查詢?nèi)蝿?wù)

QueryTask queryTask = new QueryTask("http:// sampleserver1.arcgisonline.com/ArcGIS/rest/services/" + "Demographics/ESRI_Census_USA/MapServer/5");

queryTask.ExecuteCompleted += QueryTask_ ExecuteCompleted;

queryTask.Failed += QueryTask_Failed;

//查詢?nèi)蝿?wù)的參數(shù)

Query query = new Query();

query.ReturnGeometry = true;

query.OutFields.AddRange(new string[] { "STATE_NAME", "POP07_SQMI" });

//使用文本框的文本作為查詢條件

query.Where = QueryTextBox.Text;

queryTask.ExecuteAsync(query);

}

//查詢完成后繪制結(jié)果

private void QueryTask_ExecuteCompleted(object sender, ESRI.ArcGIS.Client.Tasks.QueryEventArgs args)

{

//清除以前的結(jié)果

GraphicsLayer graphicsLayer = MyMap.Layers ["MyGraphicsLayer"] as GraphicsLayer;

graphicsLayer.ClearGraphics();

//檢查新結(jié)果

FeatureSet featureSet = args.FeatureSet;

if (args.FeatureSet.Features.Count 〉 0)

{

//將結(jié)果添加到地圖

foreach (Graphic resultFeature in featureSet.Features)

{

r e s u l t F e a t u r e.S y m b o l = L a y o u t R o o t. Resources["ResultsFillSymbol"] as ESRI.ArcGIS.Client. Symbols.Symbol;

graphicsLayer.Graphics.Add(resultFeature);

}

}

else

{

MessageBox.Show("No feature found");

}

}

//查詢失敗時，提示錯誤信息

private void QueryTask_Failed(object sender, TaskFailedEventArgs args)

{

MessageBox.Show("Query failed:" + args.Error);

}

運行效果如圖5所示。

圖5 查詢?nèi)蝿?wù)運行截圖

3 部署應(yīng)用程序

ArcGIS API for Silverlight應(yīng)用程序的部署步驟為：①安裝。②配置IIS。右鍵點擊“IIS信息服務(wù)—網(wǎng)站—默認網(wǎng)站”，彈出“屬性”頁，選擇“http頭”標(biāo)簽，點擊“MIME映射”的“文件類型”按鈕，彈出文件類型窗口，點擊新類型，新加.xap和.xaml兩個類型，點擊確定完成設(shè)置。③編譯網(wǎng)站程序并發(fā)布。編譯好Silverlight地圖應(yīng)用程序，在IIS創(chuàng)建虛擬目錄，指向網(wǎng)站應(yīng)用程序(后綴為.web的應(yīng)用程序)，完成發(fā)布。④在網(wǎng)頁中打開地圖應(yīng)用程序查看是否部署成功[8]。

4 結(jié) 語

ArcGIS API for Silverlight使用起來比ADF框架更加輕巧，而且功能強大，可以與多種當(dāng)今主流技術(shù)交互。本文只是介紹了ArcGIS API for Silverlight的入門知識，讀者可在此基礎(chǔ)上開發(fā)出界面更加友好、功能更加全面的WebGIS應(yīng)用程序。

[1] 王京.基于Flex的WebGIS的設(shè)計與實現(xiàn)[D].西安:西安科技大學(xué),2011

[2] 王天寶,王爾琪,盧浩,等.基于Silverlight的WebGIS客戶端技術(shù)與應(yīng)用試驗[J].地球信息科學(xué)學(xué)報,2010,2(1):69-75

[3] Preciado J C,Linaje M,Sanchez F,et al.Necessity of Methodologies to Model Rich Internet Applications[C].Web Site Evolution(WSE 2005),Seventh IEEE International Symposium,2005

[4] 賈慶雷,萬慶,邢超.ArcGIS Server開發(fā)指南——基于Flex和.Net[M].北京:科學(xué)出版社,2011

[5] 何正國,杜娟,毛海亞.精通ArcGIS Server應(yīng)用與開發(fā)[M].北京:人民郵電出版社,2013

[6] 劉光,唐大仕.ArcGIS Server JavaScript API開發(fā)GeoWeb2.0應(yīng)用[M].北京:清華大學(xué)出版社,2010

[7] 賈靜,耿襯.基于ArcGIS API for Flex的Web應(yīng)用初探[J].地理空間信息,2012,10(3):114-118

[8] 孫超,鐘珞.基于Silverlight的富界面應(yīng)用研究[J].武漢理工大學(xué)學(xué)報,2008,12(12):95-97

P208

B

1672-4623（2015）04-0095-04

10.3969/j.issn.1672-4623.2015.04.034

龍際夢，碩士，主要從事軍事地理信息系統(tǒng)研究。

2014-06-27。

項目來源：國家自然科學(xué)基金資助項目（41301125）。