echarts 柱状图 鼠标悬浮自定义 tooltips 自定义

 

效果：

1. 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47

option = {   color: ['#3398DB'],   tooltip: {     trigger: 'axis',     formatter: function (params) {       // console.log(<strong>JSON.stringify(params)</strong>);       return (<strong>         params[0].name +         `</br> <span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:#3398DB;"></span>` +         `响应速度 : ` +         params[0].value +         `</br> <span style="display:inline-block;margin-right:4px;border-radius:10px;width:10px;height:10px;background-color:#3398DB;"></span>` +         `类型: User ` +         params[0].dataIndex      </strong> );     },     axisPointer: {       type: 'shadow',       label: {         backgroundColor: '#6a7985'       }     }   },   grid: {},   xAxis: [     {       type: 'category',       data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],       axisTick: {         alignWithLabel: true       }     }   ],   yAxis: [     {       type: 'value'     }   ],   series: [     {       name: '直接访问',       type: 'bar',       barWidth: '60%',       data: [10, 52, 200, 334, 390, 330, 220]     }   ] };