Map with Orthographic (globe) projection

Type tutorial

This short tutorial will show how you can create a Globe out of your map using Orthographic projection. Setting projection As you may already know, each map can be displayed in a number of ways – projections. (more about it here) Each one has it’s own advantages and disadvantages. However, only one can be used […]

Highlight all polygons in Map Series on hover

Type tutorial

This tutorial will show how you can highlight all of the polygons in the same series, when just one of those is hovered. Prerequisites States and events The solution explained in this tutorial relies heavily on two amCharts 4 concepts: States and Event listeners. Make sure you’re familiar with both of the those (linked above). […]

Dynamically adding and removing Series

Type tutorial

This tutorial will show how you can dynamically add and remove series to the chart. Adding series Adding a series to the chart is as simple as pushing a series object into chart’s series┬álist: let series = new am4charts.LineSeries(); // configure series chart.series.push(series); var series = new am4charts.LineSeries(); // configure series chart.series.push(series); The chart will […]

Creating a Bullet Chart

Type tutorial

This short tutorial will show how to easily create a bullet chart. The chart Let’s start with the complete code to the chart, and dissect the code afterwards: /* Create chart instance */ let chart = am4core.create(“chartdiv”, am4charts.XYChart); chart.paddingRight = 25; /* Add data */ chart.data = [{ “category”: “Research”, “value”: 45, “target”: 80 }, […]

Creating Translations

Type tutorial

amCharts 4 replies on locale files for localization of the charts. Locales are responsible for both translations of prompts and setting date/number formats. This tutorial will explain how you can make changes to existing translations, and create the new ones. If you ended up here, you probably already know how locales are used. On the […]

Using Axis Ranges on Radar Chart

Type tutorial

This quick tutorial will show how you can use Axis Ranges on a Radar chart. If you are already using Radar chart, you know that its essentially bent XY chart. Which means it has X and Y axes, that can be one of the three types: Value, Date, or Category. This also means, that whatever […]

Pre-hiding Pie Chart Slices

Type tutorial

Sometimes you will have a Pie chart with a lot of slices. This tutorial will teach how to automatically pre-hide some of them using “data fields” and data. Prerequisites Before we begin, let’s make sure we absolutely know how Pie series’ data fields work. To do so visit “Setting up series” section in our Pie […]

Disabling toggling of items in Legend

Type tutorial

Normally a Legend will allow toggling of its items. This will also toggle related items, like chart’s Series. This tutorial will show how to disable this default functionality. To disable toggling of items, all we have to do is to make those items non-clickable. Legend’s items are stored in its itemContainers template list. So all we […]

Handling repeating categories on Category Axis

Type tutorial

Sometimes you will end up with an XY chart that has non-unique categories in its data. This tutorial will explain how to deal with such situation. Base chart We’re going to start off with a very basic XY chart that has a category axis, and some matching categories in its data: [{ “category”: “1st”, “value”: […]

Drill-down Sankey Diagram

Type tutorial

This tutorial will walk you through building a multi-level drill-down Sankey Diagram. Prerequisites Before we start off, make sure you brush off your knowledge in following topics: Anatomy of a Sankey Diagram Event Listeners List Templates Task We are going to build a Sankey Diagram. When you click on a link, the chart will update […]