Javascript SVG使用黑色填充而不是映射颜色

我有一个包含许多svg矩形的绘图。大多数情况下，我都能很好地进行绘图和填充，但初始矩形不像我的彩色地图中那样是蓝色的：

var colorMap = {
  0: "blue",
  1: "red",
  2: "yellow",
};

console.log（）

显示传递了正确的整数，并且对象关联了正确的颜色。我的csv中的其他列是浮点数，但我的颜色贴图的值是整数。该列的标题为

id

，并采用3个值中的1个：0、1或2

我已经读到，当数字是浮点而不是整数时，可能会发生此错误。但据我所知，它们都是整数。即使我的0条目不是一个整数（无论出于什么原因），为什么该列中的所有其他条目都工作正常？让D3将某些数字识别为浮点数，而将其他数字识别为同一精确列中的整数，这将非常违反直觉

也许这根本不是关于整数/浮点数的问题，我可能忽略了其他东西吗？

在JavaScript（以及我所知道的所有语言）中，

0

是错误的，也就是说，它的计算结果是

false

。这些措施包括：

• false

• null

• 未定义

• 0

• NaN

• “”（空字符串）

尽管如此，这：

.style('fill', function(d) {
    var colorID = d.id;
    if (colorID) {
        return colorMap[colorID];
    }
});

。。。当

colorID

为零时，将计算为

false

，因此当

d.id

为零时，将避免使用

colorMap

解决方案：放下它：

.style('fill', function(d) {
    return colorMap[d.id];
});

或者，如果您只是想检查财产是否存在：

.style('fill', function(d) {
    var colorID = d.id;
    if (colorID != undefined) {
        return colorMap[colorID];
    }
});

---

这是您更新的bl.ocks:

您尝试过使用十六进制值而不是颜色名称吗？这真的很有趣，谢谢您提醒我。我把它放在那里是为了避免其他数据集出现na错误，现在我想我将使用

=如您所建议的，未定义。