title: d3.js Linking multi-line chart with bar chart on mouseover
body: <p>I'm trying to link interactions on a bar chart with related data in a line chart using d3.js. I have it working now so hovering over a line highlights the associated bar, but am having trouble getting the reverse to work (i.e. hovering over a bar to highlight the related line).</p>
  
  <p>I am relatively new at this, but I'm guessing it has something to do with how I'm trying to access the underlying data in the line chart to identify a match.</p>
  
  <p>I've searched through stackoverflow answers and elsewhere but can't figure out what I am missing. Suggestions?</p>
  
  <p>The <a href="http://bl.ocks.org/threestory/c8b6db6e67482ee12840" rel="nofollow noreferrer">code on bl.ocks.org</a></p>
  
  <p>And here's the code snippet for the bar chart mouseover that's not working.</p>
  
  <pre><code>        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");
  
              });
  </code></pre>
  
  <p><strong>Edit:</strong>
  Found another answer that it is helpful for questions like mine:
  <a href="https://stackoverflow.com/questions/11206015/clicking-a-node-in-d3-from-a-button-outside-the-svg/11211391">clicking a node in d3 from a button outside the svg</a></p>