ArcGIS Server Development Blog

The ArcGIS Server Development Blog has moved

2007-05-09T16:00:00Z

The ArcGIS Server Development Blog has moved to the ESRI blogs home at http://blogs.esri.com/arcgisserver. Please update your bookmarks and RSS feeds to reference the new location.

As part of the move, any current accounts you’ve created on this blog will be unavailable on the new site. Instead, you can use your ESRI Global Account if you wish to sign in to the new site. Creating an ESRI Global Account is free and available to everyone.

The blog will still be written by the ArcGIS Server development team, and you’ll be able to see all previous posts and comments. We apologize for any inconvenience caused by this move, and look forward to your continued support and readership.

Follow-up to Extending the QueryAttributes Task: Zooming to selected features

2007-05-03T19:15:00Z

From Bryan Baker, a product engineer working on the .NET SDK:

I wrote an earlier post that showed how to extend the QueryAttributes task so that all features are immediately highlighted. Several users have asked about also zooming to the selected features. I'll show that here, though keep in mind that the user can also zoom to the selected features by right-clicking on the node for the layer (Cities in the graphic at the top of the earlier post) and choosing to zoom to selected features.

It turns out that it's a little more difficult to zoom to the features than I originally thought, because the FullExtent property of the graphics layer is null for queries like this. Instead, we have to construct our own envelope around all the features by looping through them. This isn't that difficult, though of course it does require more processing.

I’ve included code below that does the zooming. This code should be added to near the bottom of the existing code in the earlier post. If for some reason you didn’t want to highlight all the features, you could omit or comment out the line in the loop that sets the selectedCol to true.

The code below first creates an envelope to use, then in the existing loop that selects each feature, it widens the envelope to surround each feature. Once it has the envelope, it gets a reference to the Map control so it can set the Map’s extent. This takes some work, since the task itself has no reference to the Map. We have to get the ID of the Map and then search the page’s control tree. Since the Map control could be nested within another control, such as in a FloatingPanel, we search for it recursively using a custom function (found at the bottom of this listing).

One more thing before we zoom the map: the task could be querying a point layer, and if only one point is found, the “envelope” around all features is a point. We can’t zoom to a point, so instead we set the envelope to a percentage of the full extent of the Map (five percent—this value is hard-coded here, and you can change it depending on tightly you want to zoom in this one-point case).

Finally, we’ve got an envelope that will work, and we set the Map to this extent, refresh the Map, and copy its CallbackResults to the task’s CallbackResults. This last step is necessary because a callback only works with one control (the task in this case), and we need to tell another control (the Map) to update its contents.

' Set up the items to hold the extent of all features

Dim geom As ESRI.ArcGIS.ADF.Web.Geometry.Geometry

Dim layerEnv As New _

ESRI.ArcGIS.ADF.Web.Geometry.Envelope( _

Double.MaxValue, Double.MaxValue, _

Double.MinValue, Double.MinValue)

' Set each feature to selected (this loop is

' at the end the code in my previous blog post)

For Each row As DataRow In graphicsLayer.Rows

row(selectedCol) = True

' Enlarge the overall envelope to

' include the current feature

geom = graphicsLayer.GeometryFromRow(row)

layerEnv.Union(geom)

' If any records found, zoom to them

If graphicsLayer.Rows.Count > 0 Then

' Get a reference to the Map - have to search the Page since

' task itself has no direct reference to the Map

' (the task's TaskResults does have the ID of the map)

Dim mapCtrl As Map = Nothing

Dim taskResultsId As String =

Me.TaskResultsContainers(0).Name

Dim taskResults As TaskResults = _

CType(FindControlRecursive( _

Me.Page, taskResultsId), TaskResults)

If Not TaskResults Is Nothing Then

mapCtrl = CType(FindControlRecursive( _

Me.Page, taskResults.Map), Map)

End If

If Not mapCtrl Is Nothing Then

' If only one point found, envelope will be a point

' -- set to a percentage of the full extent

If layerEnv.XMin = layerEnv.XMax AndAlso _

layerEnv.YMin = layerEnv.YMax AndAlso _

Not IsNothing(mapCtrl) Then

' Percentage of the full extent to use when zooming to point

Dim zoomToPointPercentage As Integer = 5

Dim NewWidth As Double = mapCtrl.GetFullExtent().Width _

* (zoomToPointPercentage / 100)

Dim NewHeight As Double = mapCtrl.GetFullExtent().Height _

* (zoomToPointPercentage / 100)

layerEnv.XMin -= NewWidth / 2

layerEnv.XMax += NewWidth / 2

layerEnv.YMin -= NewHeight / 2

layerEnv.YMax += NewHeight / 2

End If

' Now we can zoom the map to the extent of the features

mapCtrl.Extent = layerEnv

mapCtrl.Refresh()

' We have to tell the client to refresh, using CallbackResults

Me.CallbackResults.CopyFrom(mapCtrl.CallbackResults)

End If

Below is the function called in the above code. This searches the page and its child controls for the control with the given ID. Put this after the end of the Execute method (End Sub), but inside the Class (before the End Class statement).

' Finds the control in the Page's control tree

Public Function FindControlRecursive(ByVal root As _

Control, ByVal id As String) As Control

If root.ID = id Then

Return root

End If

Dim c As Control

For Each c In root.Controls

Dim t As Control = FindControlRecursive(c, id)

If Not t Is Nothing Then

Return t

End If

Return Nothing

End Function

If you add the code above to the custom task as outlined in the earlier blog post, it should automatically zoom to the extent of all features found by the task.

Customizing the Web Editor task

2007-05-02T17:30:00Z

James Goodrich, a developer on the .NET Web ADF team, contributed this information about some Service Pack 2 enhancements to the Editor task:

When the Editor task was released at version 9.2 of the Web ADF for the .NET Framework, a common question was "How can I customize the Editor task?". Service Pack 2 provides an answer to this question. You can now customize the Editor task with custom tools and Editor Panels and we have added more events that allow you to hook into the Editor task.

In addition to these new customization options for developers, the Editor task has another key change at Service Pack 2 which it allows it to be configured with a pooled map service. You can edit non-versioned data using a pooled map service.

See the Editor Task control discussion in the Developer Help for samples and instructions.

How to track pending tiles and display a busy indicator in a Web mapping application

2007-05-01T19:05:00Z

Rex Hansen contributed this post about how to use some of the enhanced JavaScript in Service Pack 2 to track pending tiles and display a busy indicator (such as an animated "Loading" graphic) over the Web ADF's Map control:

As a Web ADF developer working in an asynchronous communication environment, it is often beneficial to provide an end user with some indication that a user action is being processed. Since most Web ADF applications are centered on working with a map, the ability of an end user to effectively interact with map contents is essential. The Web ADF has the ability to asynchronously retrieve map data from multiple sources and consolidate it in a single map control. In general, data sources often differ in the time it takes to respond to a request. Since the Web ADF Map control is capable of rendering map data as it is returned to the browser, it’s possible that some portion of data in the map is visible and accessible before another portion. In this case, it will likely be important to let the end user know when the map control has finished loading map data from any and all sources.

To support this capability, 9.2 service pack 2 includes an enhanced Web ADF JavaScript Map object. The JavaScript Map object has a set of “event handlers” on the pendingTiles property. The pendingTiles property references an array of map image tiles to be rendered. The array is updated when the map needs new image tiles based on the current extent. Events on the pendingTiles property are listed below:

Event	Description
add_onRequestsPending	Triggered when the number of items in the pendingTiles array changes from 0 to a higher value
add_onRequestsRemove	Triggered when an item is removed from the pendingTiles array
add_onRequestsCompleted	Triggered when the number of item in the pendingTiles array changes to 0

Use these handlers on the Map object’s pendingTiles property to register a JavaScript function with the event. For example:

map.pendingTiles.add_onRequestsPending(showBusyIndicator)

where map is the Map object and showBusyIndicator is a JavaScript function to call when the number of items in the pendingTiles array changes from 0 to a higher value.

The JavaScript function showBusyIndicator may appear as follows.

function showBusyIndicator(sender) {

showLayer("BusyIndicator");

if (sender!=null) {

window.status = "Pending Tiles: " + sender.pendingTiles.length;

}

The argument to the function is a reference to the JavaScript Map object. This argument can be used to gain access to map properties, such as the number of map image tiles left in the pendingTiles array. In this example, the number of pending tiles is output to the browser window’s status bar. If the argument is null, the pendingTiles array contains 0 items. The Web ADF includes two convenient JavaScript functions to show or hide a layer (div) based on its id, named showLayer and hideLayer, respectively. The functions are contained in the display_common.js file which is by default embedded with the Web ADF controls. In this example, the showLayer function is used to make the contents in the div tag with an id of “BusyIndicator” visible.

Included below is a simple Web page with a MapResourceManager, Map, and a div tag containing an image. The JavaScript Map object events are handled after the form to let the content of the form load before interacting with it.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="ESRI.ArcGIS.ADF.Web.UI.WebControls, Version=9.2.2.1350, Culture=neutral, PublicKeyToken=8fc3cc631e44ad86"

Namespace="ESRI.ArcGIS.ADF.Web.UI.WebControls" TagPrefix="esri" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<title>Untitled Page</title>

</head>

<body>

<div>

<esri:MapResourceManager ID="MapResourceManager1" runat="server">

</ResourceItems>

</esri:MapResourceManager>

<esri:Map ID="Map1" runat="server" Height="453px" Width="556px" MapResourceManager="MapResourceManager1">

</esri:Map>

</div>

</div>

</form>

function showBusyIndicator(sender) {

showLayer("BusyIndicator");

if (sender!=null) {

window.status = "Pending Tiles: " + sender.pendingTiles.length;

}

function showPendingTiles(sender) {

if (sender!=null) {

window.status = "Pending Tiles: " + sender.pendingTiles.length;

}

function hideBusyIndicator(sender) {

hideLayer("BusyIndicator");

if (sender!=null) {

window.status = "";

}

// add busy indicator functions to the map

map = Maps["Map1"];

map.pendingTiles.add_onRequestsPending(showBusyIndicator);

map.pendingTiles.add_onRequestsRemove(showPendingTiles);

map.pendingTiles.add_onRequestsCompleted(hideBusyIndicator);

</script>

</body>

</html>

Configuring your server to display a "Data not available" tile for empty map cache areas

2007-04-12T16:00:00Z

Sterling Quinn of the Server team contributed this post on configuring your web server to display custom tiles in areas where you have not yet completed your map cache.

At the ESRI Developer Summit, several of you asked how we displayed a “Data not available” tile in empty areas of the ArcGIS Online services. This kind of tile can be useful if someone pans to the edge of the map or navigates to an area that you have not completed caching. Configuring your server to return a “Data not available” tile can in some cases yield a better user experience than returning nothing.

To display the tile, you need to create a custom error response on your virtual cache directory for HTTP Error 404: “Not Found”. Instead of an error message, the Web server returns the tile.

Following are steps for this process in IIS. Before you perform these steps, you should put the blank or “Data not available” tile in your cache directory. The tile you use must have the same dimensions and image format as the other tiles in the cache.

1. In IIS Manager, right-click the Virtual Directory for the specific cache and select Properties.

2. Click the Custom Errors tab, scroll down, and select the 404 error code.

3. Click the Edit button. In the URL box, specify the tile that IIS should return whenever a tile is missing. It is important to use a URL and not just a path to a file.

4. Click OK. Your dialog should look similar to the one below. Click OK again to return to IIS Manager.

You can download a sample, "Map data not yet available" tile (512 X 512 JPG) that you can use here.

Using ASP.NET AJAX with the Web ADF

2007-04-02T14:21:00Z

Bryan Baker of the .NET SDK team wrote this great article on integration ASP.NET AJAX with the Web ADF.

Microsoft's new ASP.NET AJAX enables developers to refresh portions of a Web page in a relatively simple way. To enable a control to use AJAX, the developer can put the control inside an UpdatePanel. Then any events on the control are automatically handled via AJAX, and updates are passed back without refreshing the entire page. For example, a page might have two drop-down lists. The first lists types of features, such as Cities and Countries. When the user picks a value in the first drop-down, the second list is populated with new values corresponding to the first list's value, such as a list of cities.

Web ADF developers might want to use this approach to update the Map or other ADF controls. For example, when the user selects a city in the second drop-down list, the Map would zoom to the selected city. The problem is that ASP.NET AJAX was released after the 9.2 version of the Web ADF, and these new features were not available to be incorporated. Putting Web ADF controls inside an UpdatePanel will not work correctly, and is not supported. At 9.3 ESRI does plan to support Web ADF controls with ASP.NET AJAX.

You can have both Web ADF and ASP.NET AJAX controls on the page. The challenge is doing something like the example above, where controls in an UpdatePanel communicate with Web ADF controls. This post shows one approach for this. It turns out that it takes less than a dozen lines of code beyond what would have been needed had the Map been inside the UpdatePanel! You can follow along if you have installed Visual Studio 2005, the Web ADF, and the ASP.NET AJAX 1.0 extensions.

Add the controls

I first created a new website using the "ASP.NET AJAX-Enabled Web Site" template in Visual Studio. This creates a website and adds some extra items to support AJAX into both the Default.aspx page and the web.config file. You'll notice the ScriptManager control already added to the Default.aspx page, which is a non-visual control that handles the AJAX functionality. If you wanted to add ASP.NET AJAX into an existing page or website, you'd need to add these same items that the template adds in. See the ASP.NET AJAX documentation for details.

On the Default.aspx page, I added an UpdatePanel from the AJAX Extensions toolbox tab. I dragged two standard DropDownList controls into the UpdatePanel. The first DropDownList will display a list of layers. We could obtain these from the Web ADF controls on page startup, but I just added them manually for now to the Items property. I added two items: Cities and Countries. I also set the AutoPostBack property for both DropDownList controls to True. We need to do this to trigger a postback (actually a "partial postback" as ASP.NET AJAX calls it) when the user changes the selection.

Next I added a Map control and a MapResourceManager control from the ArcGIS Web Controls. Tip: having a drop-down list just above the map inteferes with the drop-down's functioning, so I put the map above the drop-down lists for this demo. I set the MapResourceManager property of the Map, and I added a resource item (map service) to the MapResourceManager as required to enable the map to display the service. In my case I used a world map with cities and countries. My simple page looks like the example here.

Update DropDownList items with ASP.NET AJAX

When the user changes the first drop-down list, the second list should display a list of cities or countries. Using ASP.NET AJAX allows us to treat this like a standard postback event. Behind the scenes, ASP.NET AJAX handles the request using AJAX methods rather than a full postback. Fortunately we don't have to deal with those details here.

I double-clicked on the DropDownList1 on the design page, which creates the method to handle the user selection in the code-behind page. We need to also fill the second DropDownList at startup, so we'll create a separate method and call it from both the drop-down's change method and the Page load method (which we can create by double-clicking on the design page). The UpdatePlaceList method fills the second DropDownList with locations and coordinates that we'll use later for zooming the map. The code below is in VB; both C# and VB versions are available in the download link at the end of this post.

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    If Not Page.IsPostBack Then

        UpdatePlaceList()

    End If

End Sub





Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)

    UpdatePlaceList()

End Sub



Sub UpdatePlaceList()

    DropDownList2.Items.Clear()

    If DropDownList1.SelectedValue = "Cities" Then

        DropDownList2.Items.Add(New ListItem("Cape Town", "17|-36|21|-32"))

        DropDownList2.Items.Add(New ListItem("Oslo", "9|58|13|62"))

        DropDownList2.Items.Add(New ListItem("Washington", "-79|37|-75|41"))

    ElseIf DropDownList1.SelectedValue = "Countries" Then

        DropDownList2.Items.Add(New ListItem("Australia", "112|-43|157|-10"))

        DropDownList2.Items.Add(New ListItem("Brazil", "-73|-33|-31|6"))

        DropDownList2.Items.Add(New ListItem("China", "75|16|136|55"))

    End If



End Sub

Zoom the Map when user selects a place

When the user selects a place in the second DropDownList, we need to zoom the map to the coordinates of that place. The challenge is to have the map's new extent be communicated to the client. Since the Map control cannot be in the UpdatePanel, we have to use another approach to communicate the results of the extent change to the Map.

The user selection in DropDownList2 triggers another partial postback. To set up the code for this, I double-clicked on DropDownList2 in design mode to create the method to handle the selected-index change. Inside this new method, I obtained the coordinates to zoom to from the DropDownList2.SelectedValue property. I parsed this value into an array of coordinate values, created a new envelope, and set the envelope's extent to these coordinates. I then set the Map's extent to this new envelope. This changes the map extent on the server. However, the client won't be aware of the change and won't obtain a new map unless we tell it to.

To get the client to update the map, we use a feature in ASP.NET AJAX to pass information to the client. The ScriptManager.RegisterDataItem method adds information that will be passed back and evaluated on the client.

The Map's CallbackResults will have the information required to update the map on the client. We pass this information to the client using the RegisterDataItem method. We'll see shortly how the client uses this information to update the map.

The code below obtains the callback results and registers them with the ASP.NET AJAX RegisterDataItem method. The ScriptManager1.IsInAsyncPostBack property ensures that we're doing an AJAX partial postback rather than a full page postback.

Protected Sub DropDownList2_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs)



    Dim zoomString As String = DropDownList2.SelectedValue

    Dim coordArr() As String = zoomString.Split("|")



    Dim new_extent As New ESRI.ArcGIS.ADF.Web.Geometry.Envelope

    new_extent.XMin = Double.Parse(coordArr(0))

    new_extent.YMin = Double.Parse(coordArr(1))

    new_extent.XMax = Double.Parse(coordArr(2))

    new_extent.YMax = Double.Parse(coordArr(3))

    Map1.Extent = new_extent



    If ScriptManager1.IsInAsyncPostBack Then

        Dim callbackString As String = Map1.CallbackResults.ToString()

        ScriptManager1.RegisterDataItem(Map1, callbackString)

    End If



End Sub

Handle the results on the client

The results that we just registered with ScriptManager need to be handled on the client. ASP.NET AJAX has a handler approach to process items passed back to the client. I inserted the code below into the .aspx page, at a point below the asp:ScriptManager tag. This code registers a client-side handler, the PageLoadingHandler function, that will run when the page loads. This handler obtains the items registered on the server with RegisterDataItem, and checks whether any items for the map control are present. Since our server-side code added an item for the map, the code runs the next line.

This next line calls processCallbackResult and passes it the callback results we registered on the server. The processCallbackResult function is part of the Web ADF JavaScript library, which is automatically downloaded when the page uses Web ADF controls. The processCallbackResult function applies the callback results on the client by retrieving a new map. One caveat: the objects and methods in the client-side library can change, so this method could change with future versions of the Web ADF.

<asp:ScriptManager ID="ScriptManager1" runat="server" />



<script type="text/javascript" language="javascript">



    Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(PageLoadingHandler);





    function PageLoadingHandler(sender, args) {

        var dataItems = args.get_dataItems();

        if (dataItems['Map1'] != null)

            processCallbackResult(dataItems['Map1'], 'Map1');

    }



</script>

With this code in place, when the user selects an item in the places drop-down list, the server sets the map extent to that place, and the map on the client gets notified to retrieve a new map.

Tip: be careful about dragging controls around the page in Design mode when script blocks are within the page body. Doing so caused Visual Studio to remove my script block, which disabled the map update since no handler was available on the client!

Conclusion

We've seen how you can use controls in an ASP.NET AJAX UpdatePanel to control a Map in the Web ADF. Although it takes more work than if the Web ADF controls were embedded in the UpdatePanel, it is possible to do these tasks now. In our case it required less than a dozen lines of additional code compared to when the controls are all inside the UpdatePanel.

Download the code for this demo (includes C# and VB)

Try it out here.

Using custom logos in ArcGIS Explorer

2007-03-19T17:00:00Z

Mark Bockenhauer of the ArcGIS Explorer team contributed the following post on how to display a custom logo in ArcGIS Explorer.

It is common with paper maps to display a logo perhaps a company logo or government seal. The same can be done on digital ArcGIS Explorer maps by leveraging the Home Server.

The Home Server is a user defined server that ArcGIS Explorer connects to when it starts up. Typically ArcGIS Explorer checks the home server to see if its version is up to date and to get the default map to display. It does this by referencing information in the ‘explorer’ folder on the server. This folder is part of the ArcGIS Server install.

Download the explorer.zip folder before continuing with this example. This folder contains example resources for all of the ArcGIS Server Home Server settings that can be applied to ArcGIS Explorer.

Once you have downloaded the file unzip it and place it in the appropriate location on your server.

Default Locations:
.NET C:\Inetpub\wwwroot\ArcGIS\Explorer
JAVA C:\Program Files\ArcGIS\java\web_output\Explorer

To display your own custom logo on ArcGIS Explorer applications that specify your server as their home server you will need to modify the following files:

explorer\config\e2config.xml
explorer\skins\example_skin_file.xml

In the e2config.xml file the <skins> section is commented out (highlighted in bold below). Un-comment this section by removing “<!- -“ prior to the section and “- ->” following the section. You will also want type in the appropriate URL for the <skinurl> tag.

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>

</Permissions>

<!-- To use a server skin file, uncomment the 'skins' tags below by removing the exclamation point and hyphens.

Type your server name into the skin url. The server install contains an example skin file and resources -->

<!--<skins>

<skinfile>example_skin_file.xml</skinfile>

<skinurl>http://TYPE_IN_YOUR_SERVER_NAME_HERE/arcgis/explorer/skins/</skinurl>

</skins>-->

</E2Config>

Next we will modify the skin file referenced in the <skins> tags to display the desired logo. In the explorer\skins\example_skin_file you will see that all of the lines are commented out. You will also notice that there are two sections to the file. The tags in the upper section all control the ArcGIS Explorer color scheme. The tags in the lower section pertain to ArcGIS Explorer graphic elements. Un-comment this section.

<!--

<HUDFont type="Font">Verdana</HUDFont>

<ApplicationTitle type="Application">ExampleApplicationTitle</ApplicationTitle>

<DocumentPrefix type="Application">ExampleDocumentPrefix</DocumentPrefix>

<SplashScreenBitmap type="Application">example_splash_screen.png</SplashScreenBitmap>

<DisplayCustomLogo type="Application">example_custom_logo.png</DisplayCustomLogo>

<NorthArrowBitmap type="Application">example_north_arrow.png</NorthArrowBitmap>

-->

At this point if you start ArcGIS Explorer and specify your server as the Home Server, you will see the Example Custom Logo.

Setting the Home Server to your server.
1.    In Explorer, click File > Set Home Server
2.    Click “Connect to the Home Server located at”, then enter the URL to your server in the format http://<server name>/<instance name> (Example: http://myServer/ArcGIS)
3.    Click the Test button to test the connection, or click OK to return to Explorer.
ArcGIS Explorer will restart and apply the Home Server Settings.

To use your own logo you will want to change the .PNG referenced in the <DisplayCustomLogo> tag. Your .PNG file should be located in the skins folder with the skin file.

Notice that the example logo makes use of the <DisplayCustomLogoMaskColor> to display a rectangular logo.

Actual .PNG on the left, what is displayed on the Right.

For more information on making your server the ArcGIS Explorer Home Server see "Making your system an ArcGIS Explorer Home Server" under "Administering the Server" at: http://webhelp.esri.com/arcgisserver/9.2/dotNet/