(14) Design and implementation of map zooming and narrowing in Webgis

Source: Internet
Author: User

1. Background

In the previous chapter, we gave the core of the whole toolbar design, used the command pattern, and designed the base class--command class that the concrete tool class inherits. Starting from this chapter, we formally entered the design and implementation of the specific tool class.

Zoom in and Out tool is one of the most basic tools, its operation is divided into three kinds:

A. Click on the map to zoom in and out

B. Pull box, zoom in and zoom out

C. Wheel control zoom in and zoom out

For these three modes of operation, we have made different code logic designs.

2. Analysis

A. Wheel control map zooming in and out is a fixed operation that should also take effect even when switching to other operations. Therefore, this function should be put into the base class command class.

B. When you click on the map, you should select from the tool and make the map zoom to one level or one level by clicking the Point Center.

C. When zooming in on a map, zoom in and out of the map level according to the size of the drop box.

However, there is a problem here, the level of the map is fixed, if you simply turn the four-corner coordinates into a frame size, then it is likely that there is no corresponding level of this corner coordinate. At the same time, the four-corner coordinate does not necessarily have to design the actual size of the frame, there are many systems, its real four-corner coordinate is the size of the pull frame multiplied by a fixed parameter, such as 1.5 times times.

D. When the map is zoomed out, there are two ways to achieve it. A relatively complex, a relatively simple. Also below we will explain in detail.

3. How the map zooms in and out

To understand the principle of trickle amplification and reduction, we have to have a basic understanding of how tiles are obtained and displayed in a raster map, and you can look back at my second and sixth chapters in this series.

Here, I do a general explanation of the core principles of amplification and shrinking.

3.1 Flowchart

The following is a flowchart of the entire operation implementation:

3.2 Specific explanations

The operation is divided into a pull box and a click, two kinds of parameters can be obtained according to two operations. The parameters obtained for the drop-box include only the geographic corner coordinates of the screen, and the parameters that are obtained for the click Include the geographic corner coordinates of the screen and the level to be displayed.

Depending on the parameters, tile requests are also divided into two types of requests.

For parameters that have only the corner coordinates of the screen geography, the tile request will first figure out the level of the map with the most moderate corner coordinates of the screen, and then work out the geographic corner coordinates of the screen at this time and the true range of the associated tiles.

For the parameters of the corner coordinates and the display level of the screen geography, the tile request will be calculated from the new display level, the geographical coordinates of the screen should be how much, the center point is the parameter in the center of the corner of the screen coordinates.

4. Design of magnification function

In the above we mentioned two ways to enlarge the function design, click and pull the box.

A. When clicking on an action, give a range based on this center point (you can add a parameter by default), and then get the map level at this point, minus 1 if the map is not the minimum level (0), which is the level of the map that needs to be displayed (note: the smaller the level, the smaller the scale, which is magnified)

B. When the pull box is operated, the tile is requested using a drop-box range, or the range is multiplied by the base of the screen geographic corner coordinates in the request parameter.

5. Design of the reduced function

A. When you click on an action, there is no essential difference from zooming in, just add 1 to the map level you are getting.

B. Pull-box operation, as mentioned above problems. Here are two ways to solve, a relatively difficult, a relatively simple. Difficult, we need to first arrive at this time the drop frame range and the ratio of the screen range recpercent, and then there are two ways to deal with it: The general is to use the screen range divided by recpercent to get the desired screen geographical range Complex is to use this recpercent to make related changes and multiply the screen geographic range. The two methods are essentially the same. The simple way to do this is to reduce the function of the pull-frame operation is the same as when you click.

6. Optimize your work

When you pull a frame, you can draw a rectangle of the frame, which makes the effect much more flattering. There are only a few mouse events that need to be monitored to make the relevant logic control possible.

7. In-depth discussion

After we re-applied for the map tiles, changed the screen geographical coordinates, in fact, it is a function of the refresh of the map. Here, we need to throw a zoom event of a map after the map has been zoomed in and out, so that the vector layer on the map listens to the event before it can make a related redraw operation. Otherwise, the vector layer will have an overlay error with the current raster layer.

8. Summary

In this chapter we explain the design and implementation of the map zoom and zoom function, and in the next section we begin to discuss the design and implementation of the translation function of the map. The panning feature involves one of the issues I mentioned in the previous section, namely, the migration of features in vector layers. We will also dedicate a section to explain the problem of coordinate offset. The resolution of this problem, combined with the previously mentioned screen coordinates and the principle of geographical coordinates conversion, is a good solution to the problem of display of feature layers in vector layers. We welcome your continued attention.

--Welcome reprint, but retain the copyright, please indicate the source in obvious place: http://www.cnblogs.com/naaoveGIS/

(14) Design and implementation of map zooming and narrowing in Webgis

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.