0

I've built a force node layout and I want to filter the nodes using the slider directly beneath it. jsfiddle here - https://jsfiddle.net/cavvzvjn/

I know I can read in the value of the handle being moved (utilising the 'this' keyword) 

function brushed() {
    var value = x.invert(d3.mouse(this)[0])     
}

but because the handles can overlap I want to be able to read in values of both handles when one is being moved (on brush) so I can compare which has the higher/lower value and ultimately filter the nodes accordingly with something like

    array.forEach(function(d) {
        if (handle1.val < handle2.val) {
            if (d.x < handle1.val || d.x > handle2.val) {
                array[d].splice
            }
        else {
            if (d.x > handle1.val || d.x < handle2.val) {
                array[d].splice
            }               
        }
    })

So ultimately the question is (as the title says) how do I retrieve x coordinates of DOM elements relative to their container?

hwilson1
  • 489
  • 1
  • 6
  • 17
  • See e.g. http://stackoverflow.com/questions/13040685/finding-offset-position-of-svg-element or http://stackoverflow.com/questions/18554224/getting-screen-positions-of-d3-nodes-after-transform – Lars Kotthoff Apr 30 '15 at 17:21
  • I must be missing something, but doesn't `brush.extent()` give you what you want? I thought that was the whole point of using a `brush`. – Ben Lyall Apr 30 '15 at 22:45
  • I wasn't actually sure what a brush was - I've been trying to build a slider and my interpretation of using brushes to achieve this was that they were designed for some other purpose but can be utilised as sliders if tinkered with. Now that I've played around with brushes a bit I can see that yes, the whole point is to return a range to filter the thing over which you're brushing. Thanks Ben. – hwilson1 May 03 '15 at 18:18

0 Answers0