d3.js Linking multi-line chart with bar chart on mouseover -

this question has answer here:

• clicking node in d3 button outside svg 2 answers

i'm trying link interactions on bar chart related data in line chart using d3.js. have working hovering on line highlights associated bar, having trouble getting reverse work (i.e. hovering on bar highlight related line).

i relatively new @ this, i'm guessing has how i'm trying access underlying data in line chart identify match.

i've searched through stackoverflow answers , elsewhere can't figure out missing. suggestions?

the code on bl.ocks.org

and here's code snippet bar chart mouseover that's not working.

        barchart.selectall("rect")                      .on("mouseover", function(d) {                      activestate = d.state;                      linechart.selectall("line")                     .classed("pathlight", function(d) {                         if ( d.state  == activestate) return true;                         else return false;                         });                      console.log(activestate);                 })                  .on("mouseout", function() {                      d3.selectall("path")                     .attr("class", "pathbase");              }); 

edit: found answer helpful questions mine: clicking node in d3 button outside svg

hope below code work you. keep below code in mouseover of barchart

linechart.selectall("g") .each(function(d) {   if(d){     if ( d.state == activestate){       console.log(d3.select(this).select("path"));       d3.select(this).select("path").classed("pathlight", true);       return true;     }     else{      return false;    }  } }); 

//below code show highlighted region name, , don't forget remove in mouseout of barchart

var xposition = xlabel + 8;  var yposition = h/2;   linechart.append("text") .attr("id", "hoverlabel") .attr("x", xposition) .attr("y", yposition) .attr("text-anchor", "start") .attr("font-family", "ff-nuvo-sc-web-pro-1,ff-nuvo-sc-web-pro-2, sans-serif") .attr("font-size", "14px") .text( activestate);  

remove below code mouseouver

linechart.selectall("line") .classed("pathlight", function(d) {   if ( d.state == activestate) return true;   else return false; });  

if it's not working ask me, more.