Я пытаюсь создать визуализацию данных в d3.js, которая содержит две диаграммы: график с параллельной осью и горизонтальную диаграмму цветовой шкалы (я только что составил это имя, но в основном это серия цветных прямоугольников). Каждая линия на графике параллельной оси связана с набором прямоугольников на диаграмме цветовой шкалы.

Прямо сейчас, наведение курсора на заданную линию выделяет эту линию, а наведение курсора на заданный прямоугольник выделяет этот набор прямоугольников. Моя цель также состоит в том, чтобы выделять связанную линию или набор прямоугольников на противоположной диаграмме в любое время, когда пользователь наводит мышью на любой диаграмме. Кажется, это было бы довольно просто, если бы я генерировал обе диаграммы с одной и той же функцией. Тем не менее, было бы гораздо аккуратнее (и более многократно) стиль кодирования, чтобы дать каждой диаграмме свою собственную функцию и просто как-то их соединить. Я пытался заставить каждую функцию наведения мыши внутри диаграммы вызывать функцию, определенную на более высоком уровне, которая влияла на обе диаграммы, но это, похоже, не оказывало никакого влияния на диаграмму, которая не была наведена. Поскольку я до сих пор не чувствую, что полностью понимаю, как работает d3.js на базовом уровне, мне бы очень хотелось получить подтверждение того, что это жизнеспособный способ настройки моего кода. Мой код длинный и сложный, и я просто хочу получить совет по структуре, поэтому вот основная схема:

function chart1(){
    make chart
    function mouseover(d,i){
         do stuff
         chart1_globalmouseover(d,i);
    }
    chartElement.on("mouseover", function(d,i){mouseover(d,i)});
}

function chart2(){
    make chart
    function mouseover(d,i){
         do stuff
         chart2_globalmouseover(d,i);
    }
    chartElement.on("mouseover", function(d,i){mouseover(d,i)});
}

function chart1_globalmouseover(d,i){
    do stuff in chart 2's mouseover function
}

function chart2_globalmouseover(d,i){
    do stuff in chart 1's mouseover function
}

c1 = chart1();
c2 = chart2();