javascripttooltipamchartsamcharts5

AMcharts 5 Add Data to Tooltip


I have xAxis and xRenderer like this:

let xRenderer = amChartXY.AxisRendererX.new(root, {minGridDistance: 30});
            xRenderer.labels.template.setAll({
                rotation: -45,
                oversizedBehavior: "truncate",
                maxWidth: 130,
                ellipsis: "...",
                fontSize: 12,
                fontWeight: "400",
                centerY: amChart.p50,
                centerX: amChart.p100,
                spaddingRight: 15,
                tooltipText: "{category}",
            });

            let xAxis = chart.xAxes.push(amChartXY.CategoryAxis.new(root, {
                maxDeviation: 0.6,
                categoryField: "name",
                renderer: xRenderer,
                tooltip: amChart.Tooltip.new(root, {})
            }));

Like you see i have tooltip on X Axis with category equal "name". I want to add something to this tooltip. Each object with data has diffent string to add. Let's assume it's his work. So for example now my tooltips looks like names only and i want to look like "name + job" where each data has diffent job.

How can i get it?

I found example on-line with:

let xTooltip = xAxis.get("tooltip");

            xTooltip.label.adapters.add("text", function(text, target) {
                return text + " TEST";
            });

But text is always "{category}". I also found that data is in XRenderer.grid.dataItems (or something like that) and also in my array of course.

I found also something like that, but i don't know how to use it in my case: https://www.amcharts.com/docs/v5/tutorials/additional-axis-tooltip-to-display-totals/


Solution

  • I found the solution. Code is ok, in target i can find dataItems, but they will show up only when i put my cursor over data. When page is loading there will be undefined