Working in D3.js, I\'d like to select all the elements that match a selector except for the current element.
The reason is that I\'d like to mouseover a ci
If your elements have an unique CSS-accessible identifiers, you can use the :not()
selector. Some potential examples:
d3.selectAll("circle.prospect:not(#" + this.id + ")");
d3.selectAll("circle.prospect:not(." + someUniqueClassFrom(d) + ")");
d3.selectAll("circle.prospect:not([uniqueAttr=" + this.getAttribute('uniqueAttr') + "])");
The reason d3.selectAll('circle.prospect:not(this)')
doesn't work is because it's just literally saying to filter out any
elements — which is obviously not your intent, and since it's already selecting only
elements would have no effect regardless.
Even if you don't generally apply some unique DOM attribute, there's no reason you couldn't set one temporarily:
vis.selectAll('circle.prospect')
.on("mouseover", function(d) {
this.id = 'temp-' + Math.random();
d3.selectAll('circle.prospect:not(#' + this.id + ')').transition().style('opacity','0.5');
d3.select(this).attr('opacity','1.0');
this.id = '';
});
That said, however, if your elements don't already have an ID assigned already, I think Ian Roberts' solution is probably what I would do instead of this temporary identifier hack.