Hide bubble in nvd3 bubble chart

Question

I am using nvd3 bubble chart. I want to hide the bubble which contains size:0;

I have two data :-

 var data = [];     
    data.push({key: 'Male(Yes)', values: []});
    data['0'].values.push({
            x: 1
          , y: 1
          , size: 0
    });

    data.push({key: 'Male(No)', values: []});
    data['1'].values.push({
            x: -1
          , y: -1
          , size: 20
    });

I don't want to show bubble which has size:0;.

How can i hide the bubble?

Answer 1

You can do that by applying a CSS style (visibility:hidden/display:none/opacity:0) to the individual data point. One way of doing this is to select all svg objects of the type point - depending on your names used and then filter them according to size, then apply the new style to them.

svg.selectAll("#yourname svg")
    .filter(function (l) {
        return l.size== 0;
    })[0].forEach(function (d){
        d.style("visibility","hidden")
    })