Axis ranges in XYChartScrollbar

Type demo

Do you know that XYChartScrollbar is not some mystical new class, but rather a full fledged XYChart. This means that we can do with it anything we can do with a regular chart, including adding axis ranges. This demo does exactly that.

Animated bullets

Type demo

In this demo you’ll see how we can use chart’s built-in animation capabilities to add animation effects to bullets. Example #1 Example #2

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. […]

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 […]

Auto-hide value axes

Type tutorial

Normally, all initialized Value Axes are shown, even if they do not have any visible Series attached to them. This also means that when Series is toggled off, the related Value Axis will remain. This tutorial will show how we can toggle axes off together with Series. The problem Let’s take a simple multi-series multi-axes […]

Multi-color XY heatmap

Type tutorial

Normally, heatmaps that use “heat rules” are restricted to two colors as well as gradient in-between. In tutorial we’ll see how we can use adapters to apply any number of colors to heat map based on source value. The task During the course of this tutorial we’ll transform the chart to color columns in series […]

Configuring the zoom out button

Type tutorial

When XYChart is zoomed in, a small round button appears in the corner to indicate that only partial data is show, and to provide means to zoom back out. This tutorial will show how you can configure, or outright disable this control. Button element The zoom out button is accessible via chart’s zoomOutButton property. It’s […]

Disabling XY series initial animations

Type tutorial

By default, when “animated” theme is enabled, all XY series will show initial animation, growing from zero to their absolute values. This tutorial will show how you can disable that effect, without interfering with the rest of the animations. Disabling Disabling this initial effect is easy: each series has a setting showOnInit. The “animated” theme […]

“Sticky” chart cursor

Type tutorial

Normal XYCursor is hidden automatically when plot area is no longer hovered. This tutorial shows how you can easily make it “sticky”, that is make it stay in its last known location. Enabling XYCursor does not have a built-in setting to make it “sticky”, so we’ll have to improvise. For that we’ll use two components: […]