Highcharts工具提示pointFormat条件格式

时间:2020-08-19 09:52:28

标签: javascript jquery highcharts

在以下方法中,我遇到一个问题,无法在工具提示选项中显示连字符(-)代替零(0)值。当我添加条件语句及其抛出错误消息时。

tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y:.1f} %</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
}

我已附上屏幕截图供您参考: highcharts when hovering to the bar

您能帮我在工具提示中如何显示连字符而不是零吗?

1 个答案:

答案 0 :(得分:0)

您需要使用tooltip.formatter函数:

    tooltip: {
        ...,
        formatter: function() {
            var points = this.points,
                result = '<span style="font-size:10px">' + points[0].key + '</span><table>';

            points.forEach(p => {
                result += '<tr><td style="color:' + p.series.color + ';padding:0">' + p.series.name + ': </td>' +
                    '<td style="padding:0"><b>' + (p.y !== 0 ? Math.round(p.y * 10) / 10 : 'hyphen') + ' %</b></td></tr>';
            });

            result += '</table>';

            return result;
        }
    }

实时演示: http://jsfiddle.net/BlackLabel/v7oqasb5/

API参考: https://api.highcharts.com/highcharts/tooltip.formatter