Несколько событий mouseover для каждого элемента

Question

Я визуализирую беседу чата, где я добавляю строку для сообщения, представляющего длину сообщения. Существует также другая часть интерфейса для отображения статистики для каждого пользователя в чате.

ЦЕЛЬ: Когда пользователь парит над баром

1. Выделите полосу (путем перехода от серого к какому-то другому цвету)
2. отображения данных о пользователе, который отправил это сообщение

Поэтому я хотел сделать два события mouseover, один для выделения строки, а другой - для изменения отображения, но похоже, что на каждый элемент может быть прикреплено только одно событие mouseover. Как я могу сделать оба события огнем?

// add highlighting event to each rectangle 
rects.on('mouseover', function(thisData) { 
    rects.filter(function(d) { return d['userId'] === thisData['userId']; }) 
     .style('fill', users[thisData['userId']]['color']); 
}); 

// further down... 

// change display when highlighting a rectangle 
rects.on('mouseover', function(thisData) { 
    display.text(thisData['message']); // just example code 
}); 

Answer 1

вы можете создать 2 функции и вызывать их на наведении курсора мыши событие

rects.on('mouseover', function (thisData) { 
    dosomething(); 
    dosomethingelse(); 
}); 

//define dosomething and dosomethingelse 
function dosomething($var) { 
    //sample code 
} 

function dosomethingelse() { 

} 

Answer 2

Просто сделай все логики в одном обработчике наведении курсора мыши.

rects.on('mouseover', function(thisData) { 
    rects.filter(function(d) { return d['userId'] === thisData['userId']; }) 
     .style('fill', users[thisData['userId']]['color']); 
    display.text(thisData['message']); 
});