In this topic
About the GoToLocation control
Use the GoToLocation control to pan or zoom to a location (coordinate) on map. The control provides textboxes to enter the x,y coordinates and buttons to zoom or pan to the location entered. The control is buddied with the Map control and can be placed on the form or hooked to the toolbar.
Using the control
Do the following to use the control:
- Start Visual Studio to add supporting controls to the page. Set up a Web application with, at minimum, a MapResourceManager control and a Map control. Other controls can optionally be added, such as a TOC control, Toolbar control for zoom and pan functionality (you can also zoom and pan by using mouse and keyboard combinations).
- Drag a GoToLocation control to add it on the page. Move the control to the position where you want it be displayed because it cannot be moved at run-time unless placed in a floating panel (discussed later in this topic). See the following screen shot that shows the page in Visual Studio in a table layout:
- In design mode, click the GoToLocation control to set the properties. The Properties window appears showing the control's properties. The property that must be set for the GoToLocation control is the Map property. Another property that is important for proper functioning of the control is ZoomFactor. Click the drop-down arrow for the property's value, then choose the previously added Map control. See the following screen shot:
- Save and run the Web application. The GotoLocation control will be displayed as shown below. Enter the coordinates and click Zoom To or Pan To button.
Hook it up on the toolbar
The GotoLocation control can be a part of the toolbar by adding a command to the toolbar to toggle the visibility of the GotoLocation control. For this to happen, the control needs to be placed in a floating panel and necessary logic (code) should be added to handle the visibility when the command on the toolbar is clicked. The following steps show you how to accomplish this.
- In the preceding application, add a floating panel control and move the GoToLocation control inside the floating panel. See the following screen shot:
The page markup resembles the following code example:
<esri:FloatingPanel ID="FloatingPanelGTL" runat="server" Height="85px" Title="Go To Location"
Width="380px" Style="left: 51px; position: absolute; top: 272px" Visible="True"
BackColor="White" Transparency="15">
<esri:GoToLocation ID="GoToLocation1" runat="server" EnableUpdates="False" Height="75px"
SignificantDigits="3" Width="380px" XLabel="X:" YLabel="Y:" ZoomFactor="0.25"
Map="Map1"/>
</esri:FloatingPanel>
- Set the visible property of floating panel to false to ensure that when the page loads, the floating panel is not visible.
- In design mode, select the Toolbar control to show its properties. Click the ellipsis on the ToolbarItems property. Add a command and change the name property, then press OK to close the window. See the following screen shot:
- Add code to toggle the visibility of the floating panel holding the GoToLocation control. In the markup (source) mode, add the following code example between the </form> and </body> tags:
< script type = "text/javascript" language = "javascript" > function
toggleGoToLocation(){
var gtl = $get("FloatingPanelGTL");
if (gtl != null){
toggleFloatingPanelVisibility('FloatingPanelGTL');
}
else
alert("Go To Location is not available");
}
< / script >
- In design mode, select the Toolbar control to display its properties. Click the ellipsis on the ToolbarItems property. Select the command that you added to toggle the visibility (see Step 3). In the ClientAction property, add the name of the previously added JavaScript function. See the following screen shot:
- If applicable, set the DefaultImage property for the command.
- Save and run the application. The GotoLocation control is not visible at run time. However, when you click Command on the toolbar, the GotoLocation control appears. See the following screen shot:
Members
The following table shows a list of properties related to the GoToLocation control. For more information, see the GoToLocation control in the Library Reference section.
Property name
|
Type
|
Description
|
BuddyControl
|
string
|
Map control ID to which the Toc will be buddied.
|
ZoomFactor
|
double
|
Defines the zoom factor value to be used when zooming in and out of the map.
|
XLabel
|
string
|
Label to define the x coordinate.
|
YLabel
|
string
|
Label to define the y coordinate.
|
SignificantDigits
|
number
|
Number of digits after the decimal separator.
|
EnableUpdates
|
Boolean
|
Specifies whether coordinates update when the map extent changes.
|
See Also:
Web controlsTo use the code in this topic, reference the following assemblies in your Visual Studio project. In the code files, you will need using (C#) or Imports (VB .NET) directives for the corresponding namespaces (given in parenthesis below if different from the assembly name):
ESRI.ArcGIS.ADF.Web.UI.WebControls.dll