Установить подсказку динамически в HIGHCHARTS

Question

Я использую Highcharts в моем приложении.Здесь я сталкиваюсь с одной проблемой:

Мой список по оси x:

var peMList = ["EM", "UF", "WT"];

Мой объект как,

var mapObj = {};
mapObj["EM"]="Element_Missing";
mapObj["UF"]="Unknown_Format";
mapObj["WT"]="Wrong_Type";

Мой график Формат как,

tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>'+mapObj['{point.key}'],
        pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}% </b><br/>',
        shared: true
    }

Как добавить значение моего объекта в подсказку к диаграмме. Я уже добавил, но его показ не определен.

Любая помощь будет принята с благодарностью.

Answer 1

Вы должны использовать функцию formatter:

tooltip: {
    formatter: function() {
        return '<span style="font-size:10px">' + this.points[0].key + '</span><table>' + mapObj[this.points[0].key] + '</table><br/>' + '<span style="color:' + this.points[0].series.color + '">' + this.points[0].series.name + '</span>: <b>' + this.points[0].y + '% </b>'
    },
    shared: true
}

Демонстрационная версия: http://jsfiddle.net/BlackLabel/jvg0fk7y/

Справочник по API: https://api.highcharts.com/highcharts/tooltip.formatter