改变点上的风格,d3

时间:2017-10-25 21:06:27

标签: javascript d3.js

我有基于数据集的d3多边形。

 let svg = d3.select($element[0]).append('svg')
                .attr("width", 800)
                .attr("height", 800);
            let myGroups = svg.selectAll('g').data(rooms);
            let myGroupsEnter = myGroups.enter().append("g");
            myGroupsEnter.append("polygon")
                .style("fill", "none")
                .style("stroke", "black")
                .style("strokeWidth", "10px")
                .attr("points", function (d) {
                    let q = d.footprint.coordinates.map(function (point, idx) {
                        let _d = [];
                        _d.push(scale(point[0]));
                        _d.push(scale(point[1]));
                        return _d;
                    });
                    return q.join(" ");
                });
        });

当用户从单选按钮中选择一个值时,我想更改满足要求的项目的style fill属性。

我可以以某种方式更新此属性吗?或者我需要重绘一切吗?

1 个答案:

答案 0 :(得分:0)

我认为这就是你要找的东西。

.style('fill', function(d) { 
     /* match item (d) with some condition */
})

在值变化时,您可以重新设置/重新填充多边形:

svg.selectAll('polygon').style('fill', function(d) { 
    /* match item (d) with value selected */
});