Map Zoom and Navigation Controls

Overview

You can add zoom functionality for your map simply adding zoom and navigation controls to your maps, it is very useful when your map contains a lot of point or bubbles that are placed very close to each other or you need to be able to look at small regions.

Zoom and Navigation Controls are positioned as any other control - read more in Controls and Controls Positioning Tutorial.

If you don't want to use zoom, but want to be able to see labels for small regions and, for example, invoke actions for them - consider using Custom Map Region Labels.

to top

Zoom Control

Zoom control provides only zoom in and zoom out buttons, to add it just set the following:

XML Syntax
Plain code
01 <controls>
02   <zoom_panel enabled="true" />
03 </controls>

You can control start-up zoom factor, zoom step and minimum and maximum zoom factor in <zoom> subnode of <map_series>: factor defines a default zoom factor.

XML Syntax
Plain code
01 <map_series>
02   <zoom factor="1" minimum="1" maximum="10" step="2" />
03 </map_series>

You can also rotate and inverse zoom control, using orientation and inverted attributes of <zoom_panel>:

XML Syntax
Plain code
01 <controls>
02   <zoom_panel enabled="true" orientation="horizontal" inverted="true" />
03 </controls>

 

to top

Navigation Control

Navigation control provides navigation buttons, to add it just set the following:

XML Syntax
Plain code
01 <controls>
02   <navigation_panel enabled="true" step="0.1" />
03 </controls>

step attribute defines (as a ratio) map shift on navigation buttons click.

to top

Sample Map with Zoom/Navigate Controls

Settings for controls in this sample are:

XML Syntax
Plain code
01 <controls>
02   <zoom_panel enabled="true" position="right" align="near" inside_dataplot="true" />
03   <navigation_panel enabled="true" position="right" align="near" inside_dataplot="true" />
04 </controls>

 

Live Sample:  Sample US Flash Map with Bubbles, Zooma and Navigation

to top