Динамический текст подсказки amChart - PullRequest
1 голос
/ 28 мая 2019

У меня есть диаграмма Ганта, созданная с помощью amCharts, и она отлично работает.Как показано ниже, я установил TooltipText из моего ColumnSeries.

var series1 = chart.series.push(new am4charts.ColumnSeries());
series1.columns.template.width = am4core.percent(80);
series1.columns.template.tooltipText = "Load nº: {Load}\nStart: {openDateX}\nEnd: {dateX}\nType: {PartType}";

Эта часть в порядке.Но теперь мне нужно динамически изменить TooltipText в соответствии с правилом.Я прочитал документацию об адаптерах и написал этот код.

series1.columns.template.adapter.add('getTooltipText', function(text, target) {
    var data = target.tooltipDataItem.dataContext;
    if (data.Load != null )
       return "Load nº: {data.Load}\nStart: {data.openDateX}\nEnd: {data.dateX}\nType: {data.PartType}";
    else
        return "Start: {data.openDateX}\nEnd: {data.dateX}";
});

Но этот код не работает.Подсказка больше не появляется.Что я делаю не так?Кто-нибудь может мне помочь?

1 Ответ

0 голосов
/ 15 июня 2019

очень близко!

Если вы видели getTooltipText, это, вероятно, было для подсказок Axis .

Для ваших столбцов, просто tooltipText следует сделать это, поэтому попробуйте это вместо:

series1.columns.template.adapter.add('tooltipText', function(text, target) {
    var data = target.tooltipDataItem.dataContext;
    if (data.Load != null )
       return "Load nº: {Load}\nStart: {openDateX}\nEnd: {dateX}\nType: {PartType}";
    else
        return "Start: {openDateX}\nEnd: {dateX}";
});

Также обратите внимание, что я не вкладывал данные выше через data.fieldName, просто fieldName. Ознакомьтесь с нашим руководством по данным, чтобы узнать больше о том, как диаграммы определяют, где искать fieldName, то есть заполнители строк.

В демоверсии ниже я использую это:

series.columns.template.adapter.add('tooltipText', function(text, target) {
    var data = target.tooltipDataItem.dataContext;
    if (data.Load != null )
       return "Load nº: {categoryX}: [bold]{valueY}[/]";
    else
        return "Start: {categoryX}: [bold]{valueY}[/]";
});

Демо-версия:

https://codepen.io/team/amcharts/pen/ea9f73243aed2d62b768ad168a2e1dcc

Это также работает с курсором диаграммы (am4charts.XYCursor).

...