The ScaleBar control provides a simple scalebar for the map. By
default the scale bar is rendered on the client using dynamic HTML and
data sources used in the map and does not require an explicit server
request to re-render. Some properties, such as color, font, height and
units of a scale bar can be modified via public properties. If rendered
on the server, the appearance of the scale bar is determined by the type
of primary map resource in the Map buddied with the ScaleBar
control. ArcGIS Server and ArcIMS map services can generate
scale bar images. Differences in scale bar appearance based on the
resource type are provided below:
The scalebar may report incorrect scales if the map resource reports
incorrect units. For example, if using an ArcIMS service, and the ArcXML
definition file for the service contains no or incorrect map units, then
the scale may be incorrect on the scalebar.
Using the ScaleBar control
Add the controls to the page
Open or create a Web site within Visual Studio.NET.
Open a Web form in design mode, select the Toolbox, and expand the
ArcGIS Web Controls tab. Drag and drop a MapResourceManager, a
Map control, and a ScaleBar control onto the Web form.
Add one or more resources to the MapResourceManager. See the
Add Resources section in the MapResourceManager control topic for
information on how to do this. Also set the Map control's MapResourceManager
property to Map1. See Map Control for information
on setting this property. Your page should resemble the following in Visual
Set ScaleBar control properties
Select the ScaleBar control. In the Properties page:
Set the Map
property to Map1, the map control added earlier.
Note the RenderOnClient
property. By default, RenderOnClient is true which indicates
the scale bar is rendered on the client using HTML and
ArcGIS Server or ArcIMS map service. In most cases,
this property should remain true.
Set the BarUnits
property to the units desired for the scalebar. Options are: Feet, Kilometers,
Meters, and Miles.
Set the Width
property to the width desired for the scalebar (or, resize the control in the
design page by clicking and dragging the edges). The width includes both the
scalebar and the distance text.
Additional properties can be configured to change the scalebar appearance.
: font properties for the scalebar text
: background color of scalebar (default is transparent)
: color of the scalebar's bar
: color of scalebar text
Height: height of the overall scalebar control, including bar, text
The following table provides a list of properties of
interest. For complete reference information, see the ScaleBar
control in the library reference section.
||The background color of ScaleBar.
||The bar color of the scale bar image.
||The font used in the display of the scalebar text labels.
||The ScaleBar height in points (1/72 inch).
||The units of the scale bar to report.
||The color of scalebar text.
||The height of the ScaleBar control.
||The Map Control to associate with this ScaleBar Control.
||Determines if the service associated with the primary map resource
to render the scale bar on the client (true).
||Gets or sets a value indicating whether MIME data for the image
should be requested.
||The Width of the ScaleBar control.
Using multiple Scalebars
Multiple ScaleBar controls can be added to a page and buddied to a single Map
control. This is usually done to show scales in multiple units, such as miles
Positioning the Scalebar
The position of the scalebar is determined by its position on the design page.
It is possible to position the scalebar over the map, for example, in the lower
left of the map. To do this, set the web page to use absolute positioning, then
drag the ScaleBar control over the map. To change the page from flow layout
(the default in Visual Studio 2005) to use absolute positioning:
From the Visual Studio menu, choose Layout --> Position --> Auto-position
In the Options dialog under the HTML Designer category, choose CSS Positioning.
Check the box near the top to enable the option for changing position when
dragging and dropping controls. Then select the 'Absolutely Positioned' option
from the drop down. Click OK to dismiss the dialog.
Now you can drag and drop new controls onto the page and move them to a
position on the page.
Be aware the changing the above option will affect all subsequent pages created
in Visual Studio. To disable absolute positioning, use the above dialog to
uncheck the option to absolutely position controls.