需求：鼠标悬浮在表格tr元素上对应的环形图选中并显示提示文字。
代码：
let chart_;
Highcharts.chart('container', {
chart: {
type: 'pie',
options3d: {
enabled: true,
alpha: 50
}
},
colors:["#0071dd","#33b1ff","#fd491a","#18f273","#eaff00","#4070ff","#f833ff","#ff4cfa","#9ccbe6","#95e6d8","#ff99cb","#fd491a","#ffeb0d","#69eef9","#26ffc9","#ff8c19","#ac59ff","#ff0d9a","#ff5533","#ace65c","#f1d848","#feccca","#ff8a73","#d5fa96","#ffc499","#ff8a73"],
title: {
floating:true,
text: '圆心显示的标题'
},
plotOptions: {
pie: {
innerSize: 200,
depth: 70,
dataLabels: {
enabled: false,
},
}
},
series: [{
name: 'Delivered amount',
data: [
['Kiwi', 3],
['Mixed nuts', 1],
['Oranges', 6],
['Apples', 8],
['Pears', 4],
['Clementines', 4],
['Reddish (bag)', 1],
['Grapes (bunch)', 1]
]
}]
}, function(c) { // 图表初始化完毕后的会掉函数
// 环形图圆心
var centerY = c.series[0].center[1],
titleHeight = parseInt(c.title.styles.fontSize);
// 动态设置标题位置
c.setTitle({
y:centerY + titleHeight/2
});
chart_=c;
});
$(function(){
$('body').on('mouseover','tr',function(){
let chartData=chart_.series[0].data;
for(let i in chartData){
if($(this).find('.name').html()==chartData[i].name){
chart_.series[0].data[i].select()
chart_.tooltip.refresh(chart_.series[0].data[i]);
}
}
})
$('body').on('mouseout','table',function(){
chart_.tooltip.hide();
})
})
