Show “no data” warning on a chart
Type
demo This demo shows how we can use chart series’ davalidated event to display a “no data” message in a modal if data contains no items.
Grouping several series into single legend item
Type
demo This demo shows how we can selectively add series to legend, then toggle multiple series with a single legend item. The code uses series’ on() method to watch for changes in its visible setting, which is triggered when series is toggled via legend. It then hides or shows related series. It also uses series’ legendLabelText […]
Adding check marks to legend markers
Type
tutorial This tutorial will walk through the steps needed to turn legend markers into checkboxes. Adding a check mark Each marker in the legend is created from a template, which is accessible via legend’s markers.template. Besides enabling us to set any setting that would be applied to any new marker created by the legend, a template […]
Syncing axis widths across multiple charts
Type
demo This demo shows how we can use events and “ghost labels” to sync width of vertical axes across multiple charts.
Using adapters on category axis labels
Type
demo This demo shows how we can dynamically modify labels of the CategoryAxis using an adapter. We need to add an adapter on an axis label template, which is accessible via axis’ renderer: In this particular example, actual category name is being replaced with a different value extracted from data.
Triggering bullet hover with an XY cursor
Type
demo This demo shows how we can use XYCursor event “cursormoved” to automatically apply hover state to each bullet in the same category.
Show only one series at a time
Type
demo This demo shows how we can use series settings events to ensure only one series is shown on an XY chart at a time, by toggling off other series automatically.
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 […]
Auto-adjusting chart height based on a number of data items
Type
tutorial This tutorial will explain how you can easily make your chart grow or contract based on an actual number of data. The problem Let’s take a simple bar chart: It looks OK. However, it height is fixed, so if we had more bars, it might start looking a bit awkward: Or, if there are too […]
Triggering bullet hover effects with chart cursor
Type
demo These are two demos that show how we can use chart cursor’s cursormoved event to trigger hover effects on multiple series’ bullets. Changing appearance of bullets This will make bullets grow larger on the category currently hovered by chart cursor. Showing on hover only In this demo, the bullets will be hidden except on the […]