Interaction

Dragging

Zooming and panning are essential operations for every mapping application. Unfortunately they are not very easy to implement, so we start with a very simple application with with three map windows is shown: . The submit button generates a map in each window in a different color. From the first window a zoombox can be drawn, from the second a panbox, and from the third a single click event will generated. The boxes can only be initialized within the window, but can be dragged anywhere on the screen. Note that these operations are persistent: every click in the first window will start a new zoombox, every click in the second one a new panbox.

Let's look at the code. The three windows are created in the normal manner with a submit() function for each of them. The submitAll() function, assigned to the button at the top, just executes these three functions. The interesting thing are the three "global.." functions: globalZoom(), globalPan() and globalClick(). When these are executed, nothing visible happens. However, the window indicated by the second parameter will from that moment on be responsive to a zoom, a pan or a click operation. At the end of that zoom, pan, or click, the function indicated by the first parameter of globalZoom(), globalPan() or globalClick() will be executed. At the moment, these functions just redraw the maps, just as if the button at the top was clicked.