javascript - D3 中的过滤选项

原文 标签 javascript jquery graph d3.js rickshaw

我正在研究 D3(人力车框架),我必须使用名称过滤数据。

这是人力车用于创建圆圈的代码。

var nodes = graph.vis.selectAll("path").data(series.stack.filter(function(d) {
    return d.y !== null
})).enter().append("svg:circle").attr("cx", function(d) {
    return graph.x(d.x)
}).attr("cy", function(d) {
    return graph.y(d.y)
}).attr("fill-opacity", 1.0).attr('transform', 'translate(22,0)').attr("r", function(d) {
    return ("r" in d) ? d.r : graph.renderer.dotSize
});

我试图过滤数据,如
$('#BestBrands input').on("change", function () {   
    console.log("called")
    var selected = $(this).attr('name'),
        display = this.checked ? "inline" : "none";
    console.log(selected)

    graph.vis.selectAll(".filter")
        .data(series.stack.filter(function(d) {
            return series.name[0] == selected
        }))    
        .attr("display", display);
});

//series.name 等于 d3.js 中的 d.name 所以 series[0] 是第一个坐标名称
它不工作。我需要在类里面附加任何类(class)吗?我不清楚这一点。我应该怎么做才能根据名称过滤数据?

最佳答案

如果我理解你的代码:

graph.vis.selectAll("path")
  .data(series.stack.filter(function(d){
        //should return a boolean
        return selected === 'something';
       }))
    .attr("display", display);
});

编辑 :
$('#BestBrands input').on("change", function () {   
    console.log("called")
    var selected = $(this).attr('name'),
        display = this.checked ? "inline" : "none";
    console.log(selected)

    graph.vis.selectAll(".filter")
        .data(series.stack.filter(function(d) {
            return series[0].name == selected //assuming series[] is an array
        }))    
        .attr("display", display);
});

关于javascript - D3 中的过滤选项,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17184345/

相关文章:

javascript - 如何为全局变量构建JavaScript/HTML网站?

javascript - 可以将Javascript拉入Jquery吗?

javascript - Knockout js如何实现倒数计时器

javascript - 将位置从绝对位置更改为固定位置时意外跳转,为什么?

algorithm - 将图分成最小切成相同大小的不相交集

java - Hibernate 中层次结构的有效表示

javascript - JQuery - 为什么触发方法调用它三次?

jquery - jQuery淡化两个没有白色的图像

javascript - D3 : Bar chart coloring

javascript - Javascript 确认消息中的新行