Tooltip with a pointer on the side

Type tutorial

This demo shows how we can use an adapter to dynamically update tooltip bounds, so that tooltip pointer is attached to its left side, rather than in the middle. Code Demo

Automating report generation using Selenium Webdriver

Type 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 Exporting a chart from an external link You can export charts that exist on a current page. Add a file […]

Dynamically changing legend position

Type tutorial

This short tutorial will show the steps involved in dynamically changing position of the legend. Changing position The following steps are involved when changing the position of the legend, e.g. from bottom to left: For example, the below code will move the legend from bottom, to left: Demo

Grouping legend items

Type tutorial

This short tutorial will introduce two approaches that can be used to group legend items by inserting a label between its items. Approach #1 The easiest approach is to create a legend like we would do on any chart, set its data, then insert Label elements at predefined places in legend’s children list. The downside […]

Adding watermarks to charts

Type tutorial

This short tutorial will explain how we can add various types of information as a watermark on charts. In plot area of an XY chart An XY chart has a special container called a plot area, accessible via chart.plotContainer. We can create any type of element, as well as push it into plot container’s children. […]

Custom loading indicator

Type tutorial

This tutorial will show how we can build a custom loading indicator that can be toggled on and off as needed. The final loading indicator will contain following elements: Main container / curtain. Label Icon Let’s walk through all of them step-by-step. Main container / curtain We will use Container object, placed over chart to […]

Creating multi-content PDF export

Type tutorial

This extensive tutorial will show how you can use pdfmake library, which is bundled with amCharts 5 plugin Exporting, to generate full page, multi-content report PDF documents. Disclaimer Majority of this tutorial is based on using pdfmake. It’s an excellent third party library enabling generating PDF documents in JavaScript. Our aim is to walk you […]

Disabling context menu on chart

Type tutorial

Normally, browsers will display a context menu when you press right mouse button over some element. If done over amCharts 5, it will display a context menu for a <canvas> element. This tutorial will show how you can disable default behavior of a right-click on canvas elements, as well as attach built-in rightclick event to […]