Tackling label background

Type tutorial

In amCharts 4, labels – be it bullets, axis values, or just about any other text – are not limited to just font size and color. This tutorial will show how you can set background color and shape for them as well. Enabling label background Whenever you see text on a chart, it is represented […]

Building drill-down maps

Type tutorial

In this tutorial we’ll look at techniques for building various map-based drill-down scenarios. Requisites The techniques described in this tutorial rely on event infrastructure. If you’re not yet familiar how events work in amCharts 4, we suggest taking a look at “Event Listeners” article first. We also assume that you have basic knowledge of MapChart […]

Formatting date/time and numbers using “Intl” object

Type tutorial

The Intl object is the namespace for the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, and date and time formatting. This tutorial will show how you can use Intl options and locales for date/time and number formatting in place of string-based amCharts format definitions. Intro amCharts 4 uses DateFormatter and NumberFormatter objects to […]

Using “patterns” theme

Type tutorial

amCharts 4 comes with a “patterns” theme (since version 4.7.5). It’s a bit different from other themes as it modifies the output of some elements quite radically. This tutorial takes a closer look at what this theme does, and how it can be modified for various purposes. The purpose The “patterns” theme’s main purpose is […]

Using India version of world map

Type tutorial

This short tutorial will show how you can use MapChart with a version of world map that is compatible with regulations in place in India. Two versions of maps Regulations in India require contested areas to be shown as part of the country as a whole. Unfortunately, those border lines do not correspond with areas […]

Using states on LineSeries

Type tutorial

This tutorial will show how we can use states to manipulate appearance of the LineSeries in a variety of situations. SIDE READING This tutorial relies on amCharts 4 concept of states, which is a way to dynamically apply collection of values to multiple properties of an element. For more information about states, read this article. […]

Using U.S. congressional districts maps

Type tutorial

Since version 4.1.8 the geodata package for Map Chart includes a collection of maps for U.S. Congressional Districts. This tutorial will show how you can use them. Using congressional district maps The congressional district map files are located under region/usa/congressional subdirectory of the geodata package. If you are not familiar with the geodata package and how […]

Using map country name translations

Type tutorial

By default the maps bundled with amCharts 4 include names of countries in English. This tutorial will show how you can use bundled translation files to translate them into a multitude of other languages. Prerequisites The techniques described in this tutorial rely on features introduced in specific versions of amCharts 4 and Geodata packaged. Make […]

Export menu in external container

Type tutorial

By default, the chart places its export menu in one of its corners. This tutorial will show how you can easily move it out of the chart and into any container on your page. The solution If you examine ExportMenu class, you’ll notice the property named container. By default it contains reference to the <div> […]

Ordering zIndex of series lines and bullets

Type tutorial

This tutorial will show how you can control layout and ordering of LineSeries lines and their bullets. Intro Suppose we have a LineSeries with bullets. By default bullets are drawn on top of the actual lines. Now, suppose we have several LineSeries – each with its own bullets. Some of the lines intersect with lines […]