echarts tooltip formatter function with unit supported

tooltip-formatter.ts

import { EChartOption } from 'echarts';

declare interface _Format extends EChartOption.Tooltip.Format {
  marker: string;
  axisValueLabel: string;
}

const formatter: EChartOption.Tooltip.Formatter = function(params: _Format|Array<_Format>, _ticket, _callback) {
  if(params instanceof Array) {
    if(params.length) {
      let message = '';
      message += `${ params[0].axisValueLabel }`;
      params.forEach(param => {
        message += `<br/>${ param.marker }${ param.seriesName }: ${ param.value }${ param.data.unit || '' }`;
      });
      return message;
    } else {
      return null;
    }
  } else {
    let message = '';
    message += `${ params[0].axisValueLabel }`;
    message += `<br/>${ params.marker }${ params.seriesName }: ${ params.value }${ params.data.unit || '' }`;
    return message;
  }
};

export default formatter;

Usage

import formatter from './tooltip-formatter.ts';

// echarts options
{
  series: [
    {
      data: array.map(item => ({ value: item.somevalue, unit: '%' })),
    },
  ],
  tooltip: {
    trigger: 'axis',
    formatter: formatter,
  },
}