How to disable brush selection on right click in d3.js

Question

The question is how do I prevent brush events (brushstart, brush and brushend) from firing if the right mouse click was pressed. In other words I want the d3 brush to act only if the left mouse or the middle mouse button was pressed. I haven’t found a direct answer to this question neither here nor by googling for it.

Answer 1

This is what I've come up with:

var brush = d3.svg.brush()
    .x(x)
    .y(y)
    .on("brush", function() {
        //brush code
    })
    .on("brushend", function() {
        //brushend code
    })

    svg.append("g")
        .attr("class", "brush")
        .on("mousedown", function(){
            if(d3.event.button === 2){
                d3.event.stopImmediatePropagation();
            };
        })
        .call(brush)

Basically you need to add mouse-down event to the "g" element before calling the brush function. While searching on how to do this I've come to "No Zoom on Context Menu" example shown here: http://bl.ocks.org/mbostock/6140181 And after figuring it out, it was easy to do what I wanted.