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

Selectively positioning Sankey diagram labels

Type tutorial

It’s possible to selectively specify the location of Sankey diagram labels, based on the position of their parent Nodes. This tutorial will show how. Base chart The labels are all placed to the right of their respective nodes. To make the chart look nicer, lets make labels of the right-most nodes placed to the left […]

One pulled slice per Pie chart

Type tutorial

Normally, when you click/tap a slice on a Pie chart, it would pull out a little. You can have multiple slices pulled out that way. This tutorial will show how you can set up Pie chart in order to allow only one slice to be pulled at any given time. Task We want the slice […]

Configuring Small Map

Type tutorial

This quick tutorial will show you how to configure appearance of the Small map control. What is a Small map? Small map is a control that shows a bird’s eye view on the whole map, indicating current zoomed in viewport. Please refer to this section in Map chart article on how to enable it. Just […]

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

Custom Loading Indicator

Type tutorial

This tutorial will show how you can create your own custom loading indicator over chart. The task Supposedly we have a complex chart, with loads of data, which needs to be loaded from server, parsed, digested and visualized. We don’t want the empty space of a chart just sit there, so we’d like to display […]

Controlling fill direction of a Line series

Type tutorial

Normally, a Line series with fill enabled, will fill any space between itself and a horizontal “zero line”. This tutorial will explore, how we can tame it to our specific needs. Base chart Consider this basic chart. It’s a two-Value axis chart with a Line series, wiggling around zero values – both horizontally and vertically. […]

Grid over Series

Type tutorial

Chart grid belongs in the back – behind all other chart elements. However sometimes, you might want to take them the front seat. This short tutorial will show you how. Moving plot container to back The reason why grid lines appear behind series is that they belong to axes and containers that hold axes are […]

Selectively offsetting axis labels

Type tutorial

Normally, a chart will try to hide axis labels so they do not overlap. However, you might need them all displayed. One option is to rotate labels. Other option is discussed in this tutorial. Base chart The following chart was set up to show all labels, regardless if they are overlapping. categoryAxis.renderer.minGridDistance = 30; categoryAxis.renderer.minGridDistance […]

Managing width and spacing of Column Series

Type tutorial

By default ColumnSeries will size its columns so they are both as wide as possible, while maintaining some spacing between individual columns in clusters and between categories/cells. This tutorial will explain how we can manipulate width and spacing of the columns. Understanding cell width Before we begin, let’s figure out what we mean when we […]