¿Interacciones que afectan a múltiples gráficos separados en d3.js?

Estoy intentando crear una visualización de datos en d3.js que contiene dos gráficos: un gráfico de ejes paralelos y un gráfico de barras de colores horizontal (acabo de crear ese nombre, pero es básicamente una serie de rectángulos de colores). Cada línea en el gráfico de eje paralelo está asociada con un conjunto de rectángulos en el gráfico de barras de colores.

En este momento, al mover el mouse sobre una línea dada, se resalta esa línea, y al pasar el mouse sobre un rectángulo dado, se resalta ese conjunto de rectángulos. Mi objetivo es también resaltar la línea asociada o el conjunto de rectángulos en el gráfico opuesto en cualquier momento en que el usuario se mueva sobre cualquier gráfico. Parece que sería bastante sencillo si generara ambos gráficos con la misma función. Sin embargo, sería un estilo de codificación mucho más limpio (y más reutilizable) dar a cada gráfico su propia función y simplemente conectarlos de alguna manera. Intenté que cada función de mouseover dentro del gráfico llamara una función definida en un nivel más alto que afectara a ambos gráficos, pero esto no pareció tener ningún efecto en el gráfico que no se había movido. Como aún no creo que entienda completamente cómo funciona d3.js en un nivel subyacente, realmente me gustaría tener la confirmación de que esta es una forma viable de configurar mi código. Mi código es largo y complicado, y realmente solo quiero consejos sobre la estructura, así que aquí está el esquema básico:

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();

Respuestas a la pregunta(1)

Su respuesta a la pregunta