In-depth introduction to Javascript API (III)-map Configuration

Source: Internet
Author: User
Tags map class tojson
The map configuration is customized around some of the effects of basic map operations, some from program debugging, some from the appearance of the interface, and some from the server response speed.
Content directory:

1. program debugging
2. Custom navigation buttons
3. Custom motion, zoom-in and zoom-out animation
4. slide bar labeling, scale, position, and size

1. program debugging is an essential and important process in development. js debugging has a familiar tool Firebug on the Firefox browser, but such a good debugging plug-in is not yet available in the IE environment, therefore, you can use the debug console of dojo to manage debugging information and help developers.

Declare in the head area:

<Script type = "text/javascript"> djConfig =
{IsDebug: true }; </script>

Then, add event monitoring to the client's Event Response Process and write logs:
Dojo. connect (map, "onExtentChange", function (extent) {console. log ("Extent changed :"
+ Dojo. toJson (extent. toJson ()));});

2. the customization of navigation buttons is very simple. The esri. Map class provides the method corresponding to the eight azimuth angles:
Map. panUpperLeft ()
Map. panUp ()
Map. panUpperRight ()

Corresponding to the northwest, north, and Northeast respectively. Other methods can be found in the document. These methods can be called directly in the client js script event, such as The onclick event of the button.

3. the animation effects of movement and zoom in and out depend on the customer's visual experience, including the duration of map changes and the speed of movement (zoom in and out). However, you must also consider the server load, for example, the server traffic is relatively large, we can use a long duration and slow speed to improve the user experience, so that users do not have to see the blank and wait for the emergence of the map.

Move (default ):
EsriConfig. defaults. map. panDuration = 250; // 0-1000 ms
EsriConfig. defaults. map. panRate = 25; // 0-100

Zoom in/out (default ):
EsriConfig. defaults. map. zoomDuration = 250;
EsriConfig. defaults. map. zoomRate = 25;

EsriConfig can be used to override the default configuration parameters of Javascript APIs. In addition to the movement and zoom-in effects listed above, there are also slide style, annotation, zoomed-in box shape, and proxy connecting to the REST connection point.

4. the scroll bar refers to the sliding bar in the upper left corner of the map by default, which is similar to googlemap and mapbar of other popular webgis application sites. Through simple programming, you can modify the Display Effect of the scroll bar, such as labels, scales, positions, and sizes. When creating an esri. Map object, you can specify the option parameter. The slider parameter is of the Boolean type. The default value is true. If it is set to false, no scroll bar is displayed.

Scroll bar labels are the labels that need to be displayed for each level to zoom in and out the scale. By targeting cache maps, such as Level 1, level 2 ,...... Or the scale of each level

The figure shows the scale. You can use layer. tileInfo. lods to obtain the information of each level of scale.
Var lods = layer. tileInfo. lods;
For (var I = 0, il = lods. length; I <il; I ++ ){
Labels = Lods. Scale;
}

Configure esriConfig. defaults. map. sliderLabel. The default status and "esriConfig. defaults. map. sliderLabel = false" are as follows:

The position and size are specified by "esriConfig. defaults. map. slider" to allow horizontal placement of the scroll bar and the distance from the map border. The above are all considerations for client development and website interface design. Javascript API provides a set of convenient methods to achieve various effects.

Blog garden link: http://www.cnblogs.com/flyingis/archive/2008/07/21/1247636.html

This topic is highlighted by flyingis
Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.