Alternated axis fills

Type tutorial

This short tutorial will show how you can make your XY chart more readable by introducing a fill between each second set of grid lines. Enabling axis fills We’ll let you in on a secret: each axis is already filling the space between each second set of its grid lines. You just can’t see it […]

Using label bullets on a horizontal bar chart

Type tutorial

This tutorial will show how you can use LabelBullet to decorate your horizontal bar chart with data labels. Preparing Prerequisites This tutorial will rely heavily on using Series’ bullets. If you’re not familiar on how bullets work in amCharts 4, please go through “Bullets” article first. Also, since we’re going to be binding our labels to […]

Using Web Font Loader

Type tutorial

If you are using web fonts, you might have noticed an unpleasant moment when content is rendered before the font loads, making it re-render. Since the fonts have different heights and widths, the font being loaded or not may also affect measuring of elements and thus their placement. In some cases, if font is not […]

Creating themes

Type tutorial

amCharts 4 comes with a plethora of pre-made themes you can use for your charts. You can combine them by applying several themes to a single chart. But what, if you don’t find what you’re happy with? This tutorial will show how you can create your own theme. Prerequisites This tutorial shows how you can […]

Taming the Step Line Series

Type tutorial

Normal Line series on an XY chart usually connect data items with a straight line. Step line series are similar, except they connect the data items with a step. This tutorial will show how you can tweak the steps to suit your needs better. Default behavior Let’s take a very basic chart with Step line […]

Stacked column series with rounded corners

Type tutorial

This quick tutorial shows how you can inventively use adapters to apply custom formatting options to stacks of columns. The task Suppose, we have a stacked column chart. And want the top of the each stack to have rounded corners. Here’s our target chart, BTW: Rounding the corners One way to go about rounding the […]

Using Circle Bullets

Type tutorial

As you may already know from “Bullets” tutorial, a bullet in amCharts 4 can be anything. This tutorial explores how we can can quickly add and configure certain bullet type – Circle bullet. Adding a circle bullet A “circle bullet” is a special kind of bullet that already has a Circle¬†element in it, so you […]

Using filters

Type tutorial

amCharts 4 comes with a set of ready-made visual filters that you can apply to virtually any element. This tutorial will explain how you can use them. What is a filter? A filter is a method to quickly apply some visual enhancement or modification to an element. For example, you want your Line series to […]

Tooltips with rich HTML content

Type tutorial

Tooltips in amCharts 4 can display formatted information thanks to the style formatting and data binding syntax provided by built-in text formatter. However, sometimes we might go even further: use endless formatting possibilities provided by HTML and CSS. This tutorial will explain how. Base chart Let’s start with a pretty basic chart with multiple line […]

Curved Column Series

Type tutorial

This quick tutorial will serve as an introduction to the special type of series – CurvedColumnSeries. Prerequisites Just so we’re in a familiar territory, let’s start with a basic column chart. It has one Column series, with an adapter coloring each column a new color. Your just everyday normal column chart. Turning on the waves […]