Need to change CSS Property

Design
1

Hello All,

I am using Bubble Chart D3 v4 component. I need to change CSS portion with the scenario said below, I have list of data in bubbles format.When one hover on bubble, border should get changed from none to 2px.

Can Anybody help me?

Thanks In Advance, Priyanka

2

Can you use the :hover css prop to do this? So like

.your-bubble-class:hover {
   border: 2px solid black;
}
3

I am having drop down menu in which i have listed all the bubble names so when we select one from it, bubble should change css. How to get this functionality.

4

You can use the snippet above to do that, but you need to identify the bubble somehow so replace .your-bubble-class with whatever class name the bubbles have.

5

Yes that is the query …how to identify that bubble?

6

Well all the bubbles should share some css class (which you can check using the chrome dev tools). So if you replace the .your-bubble-class with a class they all share then it will work. If they don’t have a shared class then just add one when your creating the bubbles like so .attr("class", "bubble");.