在D3中仅选择一个json对象 [英] Selecting only one json object in D3

问题描述

我是d3.js的新手，目前正在研究交互式气泡图并根据需要进行修改.我正在处理的气泡图如下所示

I am new to d3.js and currently working on interactive bubble chart and modifying to my need.The bubble chart I am working on is the below

http://sunsp.net/demo/BubbleMenu/

源代码和json文件

http://sunsp.net/code/bubbleMenu.html

http://sunsp.net/code/main_bubble_json.html

在此代码中，我希望仅选择两个气泡.说Atlas和Aglab并仅显示这两个气泡，而不显示全部4个气泡.

In this code, I wish to select only 2 bubble by name.Say Atlas and Aglab and display only those two instead of all 4. How can I do that?

我尝试了下面的方法一次选择一个，但是却很简单.

I tried the below to select one at a time ,but dint work.

        var bubbleObj = svg.selectAll(".topBubble")
                .data(root.children[0])
            .enter().append("g")
                .attr("id", function(d,i) {return "topBubbleAndText_" + i});

        console.log(bubbleObj);//bubble obj is null


       // nTop = root.children.length;
       nTop = 1;

推荐答案

要过滤对特定项目的选择，请使用 selection.filter(selector) 方法:

To filter a selection to specific items, use the selection.filter(selector) method:

var desiredNames = ["Atlas", "Aglab"];
var itemsWithDesiredNames = selection.filter(function(d, i) {
    return desiredNames.includes(d.name);
});

这篇关于在D3中仅选择一个json对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！