Common MapTips

Purpose

This sample demonstrates how to programmatically manipulate Web Application Developer Framework (ADF) MapTips. The ability to perform this manipulation allows you to fully customize the format and contents of MapTips at run time. Each .aspx page in this sample demonstrates a different manipulation technique, ranging in difficulty from simple to complex.

How to use

If the sample has associated data, you will find that the sample's zip file includes a "data" folder alongside the language folders. However, you will need to update the sample to point to the location of the data once you have extracted all the files.

1. Verify that the Web ADF for the .NET Framework is installed and functioning properly. For information on installing and configuring the Web ADF, consult the installation guide.
2. In Windows Explorer, navigate to <ArcGIS Developer Kit install location>\Samples\ServerNET. This folder contains the Common_MapTips CSharp and VBNet folders.
3. Open the folder of the language you are going to use (that is, CSharp or VBNet) and copy the Common_MapTips_<language> folder to c:\inetpub\wwwroot. The <language> variable can be CSharp or VBNet.
4. Open the IIS Manager from Control Panel, Administrative Tools, Internet Information Services (IIS) Manager, or Internet Information Services.
5. In the console tree view on the left, navigate to Local Computer, Web Sites, Default Web Site. Expand Default Web Site. Right-click the Common_MapTips_<language> folder and click Properties. The Properties dialog box appears.
6. Click the Directory tab, click the Create button in the Application Settings section, then click OK to close the Properties dialog box.
7. Start Visual Studio 2010 and open the solution file for the Common_MapTips_CSharp sample Common_MapTips_CSharp2010.sln located in the c:\inetpub\wwwroot\Common_MapTips_CSharp folder.
8. In the Solution Explorer, right-click the page you want to view, and select Set As Start Page.
9. The pages in this sample are configured to use the USA map service, and it is assumed that this service is running on the local machine (localhost). You can create this service by publishing the map document located at <ArcGIS Developer Kit install location>\Samples\data\Usa\USA.mxd. For instructions on how to publish a map document to ArcGIS for Server, see the topic "Publishing a GIS resource to the server" in the ArcGIS for Server Help. Using a map service other than USA, requires modifying the sample code, as some pages specify an extent based on this data and others assume the presence of particular attributes.
10. If the USA service is not running on the local machine, you must specify the proper location by opening the page you want to view, opening the properties window for the MapResourceManager control, then clicking the ellipsis next to the ResourceItems property. The ResourceItem Collection Editor dialog box appears.
11. Click the ellipsis next to the Definition property. The Map Resource Definition Editor dialog box appears.
12. In the Data Source field, replace localhost with the name of the machine hosting the USA service.
13. Save the project.
14. Click the Debug drop-down menu and click Start Debugging.

1. Browse to the application uniform resource locator (URL), for example, http://localhost/Common_MapTips_CSharp, or start the application from Visual Studio.
2. Interact with each .aspx page as described in the following sections.

1. Move the mouse pointer over a city feature. The MapTips title is formatted as specified in the sample code.
2. Click the MapTip to expand it. As with the title, the MapTips content is formatted as specified in the sample code.

1. Move the mouse pointer over a county feature.
2. Click the MapTip that appears. The first value, which was dynamically calculated via the JavaScript specified in the sample code, matches the second value, which was populated from the feature's data.

1. Move the mouse pointer over a county feature.
2. Click the MapTip that appears. Depending on the county's population density, the background of the MapTip is red, yellow, or green.

1. Move the mouse pointer over a city feature and click the MapTip that appears (note the width of the expanded MapTip).
2. In the text box below the map, type a new width for the MapTips and click Update MapTips Width (note that the width is in pixels).
3. Move the mouse pointer over a city feature again and click the MapTip that appears. The typed width has been applied.

1. Move the mouse pointer over a city graphic feature (symbolized by a blue star). The MapTip shown has a custom layout.
2. Move the mouse pointer over a highway feature. The MapTip shown has the same custom layout because a custom default layout has been specified programmatically.
3. Execute the page's QueryAttributesTask. The custom default layout also applies to the MapTips for the task results.

1. Move the mouse pointer over a city graphic feature (symbolized by a blue star). The MapTip shown has a custom layout.
2. Move the mouse pointer over a highway feature. The MapTip shown has a different custom layout because distinct layouts for the two graphics layers have been specified in the code.

1. Select a layer from the drop-down menu below the map.
2. Once the map is refreshed, MapTips are shown for the selected layer.

1. Move the mouse pointer over a city feature. No MapTip displays.
2. Click the city feature. The MapTip displays.

1. Move the mouse pointer over a highway feature and click the MapTip that appears.
2. Repeat Step 1 for several more highway features. When a new MapTip displays, the previously displayed MapTips remain visible.
3. Click a MapTip that is obscured by another MapTip. The clicked MapTip moves to the front.
4. Click the MapTip that you brought to the front. The MapTip closes.

1. Move the mouse pointer over a city feature that overlaps other city features. The names of all the overlapping cities are shown on the MapTip that appears.
2. Click the MapTip to expand it. The overlapping features' attributes are shown in a list in the contents section.

1. Click the Find button on the AttributesOnDemandTask.
2. Hover over one of the results features and click the MapTip that appears. An activity indicator is shown while the feature's attributes are retrieved (this is replaced by the attributes once they are returned to the client).

1. Move the mouse pointer over a city feature that overlaps other city features. The MapTip that appears has a drop-down menu and a close hyperlink at the top.
2. Click the drop-down menu and select a different city. The MapTip updates to display the attributes of the selected city.
3. Click the close hyperlink. The MapTip closes.

Additional information

• CustomFormat_Server.aspx—Illustrates the Web-tier specification of the MapTip title and contents.
• CustomFormat_Client.aspx—Illustrates the client-tier specification of the MapTip title and contents.
• JavaScriptFormatting.aspx—Demonstrates how to embed JavaScript in the MapTip Contents property. Enables the creation of content that is dynamically calculated based on attributes of the feature for which a MapTip is shown.
• ConditionalFormatting.aspx—Demonstrates how to format a MapTip based on an attribute value of the graphic feature for which the MapTip is shown.
• SetMapTipsWidth.aspx—Demonstrates how to programmatically manipulate a MapTip's width.
• CustomDefaultLayout.aspx—Demonstrates how to define a custom default MapTips layout in code.
• MultipleCustomLayouts.aspx—Demonstrates how to programmatically define different MapTip layouts on different graphics layers.
• SetMapTipsLayer.aspx—Illustrates changing the layer for which MapTips are displayed at run time.
• ShowOnlyOnClick.aspx—Illustrates the use of event handling to implement MapTips that are shown only when a feature is clicked.
• StickyMapTips.aspx—Illustrates the creation of MapTips that remain open once they are expanded. This is done via extensive document object model (DOM) element manipulation and MapTips event handling. A MapTip that is obscured by other MapTips can be brought to the front by a single click, and closed by clicking again.
• CoincidentFeatureList.aspx—Demonstrates how to create MapTips that display a feature list when overlapping features are hovered over. This is accomplished by extending the Web ADF JavaScript Library's GraphicFeatureGroup to raise a coincidentFeaturesMouseOver event, then implementing a handler for this event.
• AttributesOnDemand.aspx—Illustrates modifying MapTips so that a feature's attribute data is retrieved only when a MapTip is expanded. This is done by the following:
• Extending the Web ADF JavaScript Library's GraphicFeatureGroup, GraphicFeature, and MapTips objects.
• Implementing a custom QueryAttributesTask that interacts with the JavaScript extensions.
• CoincidentFeatureDropDown.aspx—Demonstrates how to customize MapTips so that, when overlapping features are hovered over, the displayed MapTip contains a drop-down menu that allows you to select the overlapping feature with which to view attributes. Uses the same extensions as CoincidentFeatureList, adds extensive event handling, and DOM element manipulation.

Download the files for all languages