javascript - 尝试为 map D3，js v4 中的空值分配颜色

Question

我正在创建威斯康星州各县的 map 。它看起来很棒，只是其中一个县的值为“null”，在 map 上显示为 0。

我手动创建了色标，但无法弄清楚如何使空值的县变灰。

有什么想法吗？

这是我用来定义颜色的代码

    var color = d3.scaleThreshold()
        .domain([0.16,0.31,0.47,0.58,0.94,1.15,1.41,2.02,3.36,6.47])
        .range(["#f7fcf0","#e0f3db", "#ccebc5", "#a8ddb5", "#7bccc4", 
        "#4eb3d3", "#2b8cbe", "#0868ac", "#084081", "#062953"]);

我尝试在域中添加“null”并向范围添加相应的颜色，但这没有任何作用。

Answer 1

处理色标中特殊情况的一个简单方法是不将色标直接传递给 d3.attr/d3.style，而是将其包装在匿名中函数并在那里检查:

counties
    .attr('fill', d => d === null ? 'grey' : color(d))