Tag: tooltips
- Additional axis tooltip to display totalsDemo
This demo shows how we can use additional axis and adapters to display total value in additional tooltip on top of the chart.
XY - Clickable links in tooltips
Tooltips are used in a number of places to provide contextual information on a hovered/tapped object, like a Slice of a Pie Chart, or a country on a map. By default, tooltips are completely static with no way to interact with them. This tutorial will explain how you can make them interactive, adding clickable links to them.
All charts, Maps, Pie, XY - Consolidating values from multiple axes into a single tooltipDemo
If you have multiple axes and a chart cursor, each axis will get a tooltip when you hover plot area. This demo shows you you can use adapters to consolidate values from multiple axis' tooltips into one.
XY - Context-sensitive tooltip that follows mouse cursorDemo
This demo shows how we can use cursorpositionchanged event to reposition the related tooltip to the exact cursor's position.
XY - Custom static multi-value tooltip
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 you how.
XY - Different tooltip content per each level of Force Directed nodes
You can set what is displayed in a tooltip of ForceDirectedTree chart's nodes using its tooltipText property. However, the same information will be used across different levels of node tree. This tutorial shows how you can use adapters to differentiate tooltip content based on level of node.
Force Directed - Display tooltip on PieChart slice clickDemo
Normally, tooltips on PieChart slices are shown when they are hovered by a cursor. This demo will show how we can disable this default behavior and only show tooltip when slice is tapped or clicked.
Pie - Do not show tooltip for zero-value columnsDemo
This demo shows how we can use adapters to selectively disable cursor tooltips on columns with zero-value.
XY - Multi-series shared tooltip with colored bulletsDemo
This demo shows how we can use an adapter for series' tooltipText property, in-line text formatting, and cursor's maxTooltipDistance to build a single universal tooltip that displays values from all series, complete with colored bullets.
XY - Multiple cursor tooltips on scatter chart
Normally, XYCursor, if added to a chart will try to show a tooltip for each series for the hovered date or category. This does not work for charts that have both X and Y axes as ValueAxis. This tutorial will show how we can fix that.
XY - Override CategoryAxis tooltip content with an adapterDemo
This basic demo shows how you can use an adapter on CategoryAxis tooltip label to modify it's content using chart data.
XY - Overriding series' tooltip fill color
Normally, a Tooltip that is displayed when you hover or touch a series' item - slice, column, etc. - is colored the same way as the related object. This quick tutorial will show you how to override that color.
Maps, Pie, Radar, Treemap, XY - Round tooltips
Normally, tooltips in charts take square shape to match the content within. This quick tutorial will show how to configure Tooltip object to resemble a round fixed-radius shape.
All charts, XY - Show column tooltip on category hoverDemo
This demo shows how we have use "over" and "out" events on axis labels as well as chart cursor's triggerMove() method to trigger tooltips on columns of the hovered category label.
XY - Slice rollover tooltip that follows mouseDemo
Normally a rollover tooltip would display in the center of a PieChart slice. This demo shows how you can make it follow the mouse pointer instead.
Pie - Styling or removing tooltip shadow
Most of the elements on charts can display a tooltip when hovered. By default, a tooltip will cast a slight shadow behind it. This tutorial will explain on how to style it, or get rid of it altogether.
All charts, XY - Tooltips with rich HTML content
Tooltips in amCharts 4 can display formatted information thanks to the style formatting and data binding syntax provided by built-in text formatter. However, sometimes we might go even further: use endless formatting possibilities provided by HTML and CSS. This tutorial will explain how.
All charts, XY - Truncating legend labels
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.
Pie, Radar, Sunburst, XY - Using "sticky" tooltips
Any element on a chart can have tooltipText set to display in form of a tooltip when hovered or touched. This tutorial will show how you can turn those tooltips into "sticky", so they are always shown, without requiring to hover/touch the element.
All charts, Treemap, XY