在 Topojson 名称中选择单词的国家的条件颜色

Question

我在 D3 中制作了地图，并且我之前有条件地为 id 和属性分配颜色。在这种情况下，我试图根据名称中特定单词的存在有条件地着色。例如：所有名称中带有单词 "United" 的国家/地区都为蓝色，所有其他国家/地区为粉红色。在这种情况下，它会将 "United States"、"United Kingdom" 和 "United Arab Emirates" 染成蓝色。我已经尝试了 indexOf 和一些 str.includes 但它导致：未捕获的类型错误：无法读取未定义的属性 'includes'。

代码如下：https://jsfiddle.net/databayou/retk2pu6/7/

  svg.selectAll(".country")
  .data(topojson.feature(nations, nations.objects.countries).features)
  .enter().append("path")
  .attr("class", function(d) { return "country " + d.name; })
  .attr("fill",function(d){ 
          var str = d.name;
          if (str.includes("United")) { return "blue"}
                            else {return "pink";
                           }
                       })
  .attr("d", path);

Answer 1

将var str = d.name;更改为var str = d.properties.name;

如果你 console.log d，你会看到 name 在 properties.

里面

在 Topojson 名称中选择单词的国家的条件颜色

Conditional color of countries selecting word in name of Topojson

d3.js

include

conditional-statements

indexof

topojson