大二下学期第二次个人作业第二阶段

今日完成了图表联动的功能，热词云与热词统计表格的联动。当鼠标停留在表格上方时对应的热词云会联动显示，当鼠标停留在热词云上时对应的表格会高亮显示。

                        $(".tablebox2 tbody").find('tr').on('mouseenter',function(){
                            var hang = $(this).prevAll().length
                            $(".tablebox2 tbody tr").eq(hang).addClass('highTr');
                            chart.dispatchAction({ type: 'showTip',seriesIndex: 0, name:data.data[hang][0]});
                            //选中高亮
                        })
                        // 鼠标移出的第几行数据
                        $(".tablebox2 tbody").find('tr').on('mouseleave',function(){
                            var hang = $(this).prevAll().length;
                             $(".tablebox2 tbody tr").eq(hang).removeClass('highTr');
                            chart.dispatchAction({ type: 'showTip', seriesIndex: 0, name:data.data[hang][0]});
                            //取消高亮
                        })
                        chart.on('mouseOver', function(params){
                            console.log(params);//此处写点击事件内容
                            for(var i=0;i<data.data.length;i++){
                                // data11[i].value="0";
                                if(params.name== data.data[i][0]){
                                    console.log(params.name);
                                    //addressList[i].value="1";
                                    // 选中高亮
                                    $(".tablebox2 tbody tr").eq(i).addClass('highTr');
                                }
                            }
                        });
                        //  移出该区域时，取消高亮
                        chart.on('mouseOut', function(params){
                            console.log(params);//此处写点击事件内容
                            for(var i=0;i<data.data.length;i++){
                                // data11[i].value="0";
                                if(params.name== data.data[i][0]){
                                    console.log(params.name);
                                    //取消高亮
                                    $(".tablebox2 tbody tr").eq(i).removeClass('highTr');
                                }
                            }
                        });

.tablebox2{
    float:left;
    clear:right;
    background-color: white;
    width: 900px;
    height: 800px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.linecharbox{
    width: 1000px;
    height: 600px;
}
table td, table th {
    border: 1px solid #cad9ea;
    color: #666;
    height: 30px;
}
table thead tr th {
    background-color: #CCE8EB;
    width: 100px;
}
table tr:nth-child(odd) {
    background: #fff;
}
table tr:nth-child(even) {
    background: #F5FAFA;
}
.tablebox2 .highTr{
    background-color: #DFE7F2;
    color: #000000;
}