echart柱状图为不同柱体设置hover效果

预期效果

如图所示，鼠标hover在不同的柱体时展示不同的信息

实现

 option = {
 legend: {},
 tooltip: {
 //将trigger设置为item
 trigger: 'item', 
 //将在formatter中设置hover效果
 formatter: function (params) {
 console.log(params);
 return params.name;
 },
 },
 dataset: {
 source: [
 ['product', '2015', '2016', '2017'\],
 ['Matcha Latte', 43.3, 85.8, 93.7\],
 ['Milk Tea', 83.1, 73.4, 55.1\],
 ['Cheese Cocoa', 86.4, 65.2, 82.5\],
 ['Walnut Brownie', 72.4, 53.9, 39.1\],
 ],
 },
 xAxis: { type: 'category' },
 yAxis: {},
 series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }],
 };

当tooltip.trigger值为item，hover时，formatter的params将是单个柱体的信息
当tooltip.trigger值为axis，hover时，formatter的params为一个数组，得到是多个柱状信息