tutorial Its easy to consolidate a lot of data into a single tooltip that is displayed over Series using Cursor. We’ve covered it in this tutorial. But what if we don’t want a huge square following our cursor, and would rather display that info in a fixed place in the corner? Read on, as we show […]
tutorial If you need to automate the generation of chart images or PDF, Selenium Webdriver might be the best option. It can handle different browsers even though this example only shows it using Firefox. Setting up Install NodeJS Install Firefox Create a folder Create a file called package.json in the new folder with the content shown […]
tutorial Candlesticks are a good way to depict data dynamics using variety of metrics. Instead of single value – used on most series – candlesticks use four: open, high, low, and close. This tutorial will explain how to set up and configure Candlestick series. Adding and setting up Adding a CandlestickSeries is no different than adding […]
tutorial Normally on an XY Chart, Legend creates a single item for each Series. This brief tutorial will show how you can create custom legend which will show an item for each individual column in a single Column series. Base chart Let’s take this chart as a base. It uses an adapter to color each column […]
tutorial amCharts 4 allows automatically adding element-specific class attributes to its SVG elements for easy targeting via CSS selectors. This tutorial explains how to enable and use them. Enabling class names By default, when chart is generating SVG elements, no class attributes are added to it’s element. Let’s take a simple Line series with bullets: The […]
tutorial amCharts’ number formatter has a way of formatting numbers in a variety of ways, including converting to prefix/suffix-based shorter equivalents. This tutorial will explain how you can tweak it according to your needs. The problem Extremely big numbers on a chart can be confusing and wasteful of space: Let’s see how we can fix that. […]
tutorial Sometimes chart legend can get out of control size-wise, especially if you have long labels. This tutorial will show how you can get it back in check by capping the length of its labels. The problem Long labels will bloat up legend size. This is especially prominent where chart size is not very big: Even […]
tutorial amCharts allows any number of any type combined in the same XY Chart. Below demo demonstrates how you can combine utterly incompatible scales – numeric and date/time – with separate Value and Number axes.
tutorial It is possible to load the amCharts library only when needed. This tutorial will explain how. The import() expression is the official way to lazy load any ES6 module, including amCharts. However, import() can only import a single module, so you have to combine it with Promise.all to load multiple modules. Here is how to […]
tutorial This tutorial will show how we can retrieve latitude / longitude coordinates of a click on map. The task When user clicks or taps anywhere on the Map, we want to retrieve the geographical coordinates (latitude and longitude) of the target point. We also want to make something useful with it, say, placing a marker […]