CODEWITHSUNDEEP
javascriptsvgd3.js
bsr
bsr

Reputation: 58682

D3js applying drop shadow on mouseover

I have a gist (see preview here) about potential way of applying filter. I am not sure how to apply it conditionally on rect on which mouseover triggered. The example I see so far is applying a filter id, but if I change the filter property as in the above example, it affect all the element.

I am infact looking for box shadow to indicate a selection (as here) If you can change blur to shadow, that would be great.

thanks.

Upvotes: 2

Views: 2142

Answers (1)

Erik Dahlström
Erik Dahlström

Reputation: 60976

One way is to apply the filter property with a CSS :hover rule instead, see this example.

Define your blur filter similar to what you've already done, then use a CSS like this:

rect:hover { filter: url(#blur); }

You should probably specify a slightly larger filter region too, your blur will get clipped otherwise.

Upvotes: 2

Related Questions