在此练习中，您将向一个网页添加客户端代码，以在Virtual Earth VEMap控件中显示从GeoRSS 订阅源检索到的空间数据。VEMap控件是可以使用JavaScript代码编程的客户端控件。使用客户端代码对VEMap控件进行编程的好处是您可以轻松构建集成Internet上的多个源中的数据的混合 Web 应用程序。
注意：您可以从 C:\SQLHOLS\Spatial and VE\Solution\StoreFinderSite 中的完成的网站页面复制此练习中所用的代码。
1.添加代码以显示地图
(1)在解决方案资源管理器中，双击 Default.aspx 在设计器中打开它。
(2)如果它还未被选中，请单击设计器左下部的源选项卡查看此页的 HTML 源文件。
(3)在注释 add a reference to the Virtual Earth map control下，添加以下 HTML。
<script type="text/javascript" src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6">
</script>
(4)在 GetMap JavaScript 函数中，在注释 Display the map control下，添加以下代码。
map = new VEMap('mapDiv');
map.LoadMap();
(5)保存 Default.aspx。
(6)在解决方案资源管理器中，右键单击 Default.aspx，然后单击设为起始页。
(7)在调试菜单上，单击开始执行(不调试)。
(8)当 Internet Explorer 打开时，验证显示了地图。
(9)使用地图上的内置控件移动、缩放和更改视图。
(10)关闭 Internet Explorer。
2.添加代码以在地图上显示所有商店
(1)在 Default.aspx 中的 ShowAllStores 函数中，在注释 Import GeoRSS feed of store data, and call onAllStoreLoad function when the data is loaded下，添加以下代码。
var veLayerSpec = new VEShapeSourceSpecification(VEDataType.GeoRSS,
"./Stores.georss");
map.ImportShapeLayerData(veLayerSpec, onAllStoreLoad, true);
注意：此代码向网站发送针对 Stores.georss 页的请求。此请求将由您在上一练习中实现的 HTTP 处理程序处理，并返回包含所有商店的 GeoRSS 订阅源。接着此代码将 GeoRSS 数据作为新层加载到地图控件中，并指定在将此数据加载到地图中后调用 onAllStoreLoad 函数。
(2)在 onAllStoreLoad 函数中，在注释 Count the shapes returned下，添加以下代码。
var storecount = feed.GetShapeCount();
document.getElementById("Info").innerHTML =
'There are ' + storecount + ' stores.';
(3)保存 Default.aspx。
(4)在调试菜单上，单击开始执行(不调试)。
(5)当 Internet Explorer 打开时，单击 Show All Stores，并验证商店在地图上显示为图钉。
(6)关闭 Internet Explorer。
3.添加代码以显示指定位置附近的商店
(1)在 Default.aspx 中的 ShowNearbyStores 函数中，在注释 Use the VEMap.Find method to find the location entered by the user and call the onFind function to process the results下，添加以下代码。
results = map.Find( null,
document.getElementById("SearchLocation").value,
null, null,null, 1, false, false, false, true,
onFind);
注意：此代码使用 Virtual Earth 根据用户输入的文本查找位置。当找到一个或多个位置时，此代码会指定应调用 OnFind 函数。
(2)在 onFind 函数中，在注释 define the search point as the latitude and longitude of the first place in the results下，添加以下代码。
var SearchFromPoint = places[0].LatLong;
注意：此代码取用在结果中找到的第一个位置，并以逗号分隔的字符串的形式提取纬度和经度。
(3)在 onFind 函数中，在注释 Import GeoRSS feed of stores near the search point, and call onNearbyStoresLoad function when the data is loaded下，添加以下代码。
var veLayerSpec = new VEShapeSourceSpecification(VEDataType.GeoRSS,
"./Stores.georss?SearchFrom=" + SearchFromPoint);
map.ImportShapeLayerData(veLayerSpec, onNearbyStoresLoad, true);
注意：此代码向网站发送针对 Stores.georss 页的请求，该请求使用一个包含搜索位置的纬度和经度的 SearchFrom 参数。此请求将由您在上一练习中实现的 HTTP 处理程序处理，并返回包含搜索区域和其中的所有商店的 GeoRSS 订阅源。接着，此代码将 GeoRSS 数据作为新层加载到地图控件中，并指定在将此数据加载到地图中后调用 onNearbyStoresLoad 函数。
(4)在 onNearbyStoresLoad 函数中，在注释 Don't count or show the first shape (the search location)下，添加以下代码。
var storecount = feed.GetShapeCount()-1;
feed.GetShapeByIndex(0).HideIcon();
document.getElementById("Info").innerHTML =
'There are ' + storecount + ' stores.';
(5)在 onNearbyStoresLoad 函数中，在注释 Show the info for the search area when the results first load下，添加以下代码。
map.ShowInfoBox(feed.GetShapeByIndex(0));
注意：此代码将显示搜索区域的信息气球。
(6)保存 Default.aspx。
(7)在调试菜单上，单击开始执行(不调试)。
(8)当 Internet Explorer 打开时，输入文本 Seattle 并单击 Show Stores Near，然后验证这些商店在地图中显示为图钉并用一个圆圈显示搜索区域。
(9)使用位置 San Francisco 和90210 重复此搜索。
(10)关闭 Internet Explorer。
(11)关闭 Visual Studio。
(12)关闭 Hyper-V，放弃更改