Pre-zooming Map to a Country

Type tutorial

You can pre-zoom the map to certain coordinates and level. If you don’t want to do that, you can make the chart pre-zoom to a particular country. This tutorial will explain how. Zooming to country The Map chart has a dedicated method for zooming to a polygon (country) of our choice: zoomToMapObject(object). The name leaves […]

Adding “Home” Button to Map Chart

Type tutorial

Map Chart can be zoomed and panned. There is, however, no built-in “go home” button. This tutorial will show how to add one which resets map’s zoom and position to initial state. Base map Let’s use this very basic map as our test subject. We can pan the map by dragging with a mouse or […]

Setting initial zoom and position of a Map chart

Type tutorial

The Map will always start off fully zoomed out and centered. However, in some cases, you might want to start the map pre-zoomed to some place. This tutorial aims to explain how to do just that. The task We want a world map. However, we want it to start pre-zoomed to Europe. Finding zoom level […]

Zooming to map area on click

Type tutorial

This tutorial will show how you can set up your map to automatically zoom to an area (i.e. country) when user clicks on or taps it. As you may be already aware if you got to this point, each area on the chart is configured using MapPolygonSeries template. This task is no different – we’ll be […]

Pre-zooming an axis

Type tutorial

This tutorial will explain how you can set up your charts to initialize pre-zoomed. Prerequisites This tutorial relies on event handlers. We recommend reading up on how events work in amCharts 4 in “Event Listeners” article. Reference chart Let’s start off with a simple date-based chart: Setting up pre-zoom There currently are no properties on […]

Resetting Map Position/Zoom

Type tutorial

All Map Charts, unless disabled, can be panned and zoomed. This tutorial will explain how to reset map’s position and zoom to its original state via custom button or API. Resetting via API Easy way Map chart provides a dedicated goHome(duration) method. I wish it had a youredrunk parameter, but it only accepts a duration in milliseconds […]

Disabling zoom and pan on a Map Chart

Type tutorial

Normally, you can pan and zoom the Map Chart wit mouse and touch. This tutorial will explain how you can disable one or both of these actions. Disabling pan Panning (drag) events on a Map Chart are attached to a special container that holds all the series of the map. It’s accessible via chart’s seriesContainer property. […]