Question

我从后端获取数据，其中一些值为0。我不想为这些值创建圆圈。

我明白，我需要使用过滤器，但我不知道如何使用它。

这是我的代码：

var circles = city.selectAll("circle")
                        .data(function(d) {
                          return d.values //this is a array length 20 how to filter that? i need only with values more than 0
                        })
                        .enter()
                        .append("circle")
                        .attr("r", 3.5)
                        .attr("cx", function(d, i) {
                          return x(d.date)
                        })
                        .attr("cy", function(d) {
                          return y(d.temperature)
                        })
                        .style('cursor', 'pointer')
                        .attr("fill", "transparent")
                        .attr("stroke", "yellow")
                        .attr("stroke-width", 0);

Answer 1

如果d.values是一个数组，您可以使用Array.prototype.filter()从中提取与0不同的所有值。以下内容仅绑定非零值并仅为这些值创建圆圈：

.data(function(d) {
    return d.values.filter(function(v) { return v != 0; });
})

Answer 2

首先，我假设您的意思更像.data(dataFromBackend, function (d) { return d.values; })，否则就没有约束力了！

无论如何，为了做你正在描述的事情，并假设你根本没有在绑定中拥有0 - 值，你可以简单地做：

filteredData = backendData.filter(function (d) {
    return d.value != 0;
});

有.filter here的详细参考，但简要地说，为.filter中的每个元素调用传递给backendData的函数，每个元素都被引用通过d以通常的方式。返回值应该是布尔值（true或false），但可以使用＆＃39;真实性＆＃39;来处理任何事情。函数返回的任何元素＆＃39; truthy＆＃39; for将被包含在最终数组中（在我的示例中为filteredData），该函数返回的任何元素都是＆＃39; falsey＆＃39;不会。

d3js - 如何使用值过滤数组并传入数据？

2 个答案: