echarts绘制关系图之formatter的应用

formatter支持字符串模板和回调函数两种形式

1.字符串

formatter: '{b0}: {c0}<br />{b1}: {c1}'

• 折线（区域）图、柱状（条形）图、K线图 : {a}（系列名称），{b}（类目值），{c}（数值）, {d}（无）

• 散点图（气泡）图 : {a}（系列名称），{b}（数据名称），{c}（数值数组）, {d}（无）

• 地图 : {a}（系列名称），{b}（区域名称），{c}（合并数值）, {d}（无）

• 饼图、仪表盘、漏斗图: {a}（系列名称），{b}（数据项名称），{c}（数值）, {d}（百分比）

2.回调函数

        formatter: async (params, ticket, callback) => {
          const res = await getDetail(params.value);
          let listHtml = `<div>客商名称：${params.name}</div>`;
          if (res.list) {
            res.list.forEach((item, index) => {
              if (index === 0) {
                listHtml += `<div>OEM客商：${item.name}</div>`;
              } else {
                listHtml += `<div style="margin-left: 72px">${item.name}</div>`;
              }
            });
          }
          setTimeout(() => {
            callback(ticket, listHtml);
          }, 0.0001);
          // return 'loading';
        },

　　params 是 formatter 需要的数据集

　　ticket 是异步回调标识

　　callback 是异步回调