Question

所以我使用D3.js的Topojson功能来创建一个svg世界地图。尽管对d3来说相对较新，我已经设法弄清楚了规模和所有事情到目前为止。我遇到的问题是尝试使用我定义的一些集合来合并或过滤topojson文件中的数据。我将省略用于投影的功能。这是我到目前为止所做的：

var svg = d3.select("#map svg");
var regions = [
    {
        region: 'low',
        set: d3.set([ "USA", "CAN" ])
    },
    {
        region: 'med',
        set: d3.set([ "AUS" ])
    },
    {
        region: 'high',
        set: d3.set([ "RUS" ])
    }
];
d3.json("site/js/topo.json", function(error, topology) {
    // INDIVIDUAL COUNTRIES
    svg.selectAll("path")
        .data(topojson.feature(topology, topology.objects.worldByIso).features)
        .enter()
        .append("path")
        .attr("data-iso", function(d){ 
            return d.properties.iso;
        })
        .attr("d", path);
});

我能够将topojson文件中的d.properties.iso值返回到数据属性，但我真正想做的是检查针对'regions'数组的iso属性，而不是返回该区域（低，中或高）如果匹配该组。

理想情况下，解决方案不需要每次都检查“区域”，以便快速处理。希望这一切都有道理，我正在写这篇文章，因为我从加班时间跑出了门！

Answer 1

<强> Array.reduce

我想你想要Array.reduce()。这样您就可以将数组折叠为单个值。我将d3.sets更改为简单数组，因此我可以使用contains()方法，但快速浏览一下d3文档看起来就像他们的集合有has()而已。

＆＃13;

var regions = [{
    region: 'low',
    set: ["USA", "CAN"]
  },
  {
    region: 'med',
    set: ["AUS"]
  },
  {
    region: 'high',
    set: ["RUS"]
  }
];

let getRegion = r => regions.reduce((a, c) => c.set.includes(r) ? c.region : a, null);

console.log(getRegion('AUS'));
console.log(getRegion('USA'));
console.log(getRegion('EUR'));

＆＃13;

如何将D3.js Topojson中的数据合并到定义的set to set class

1 个答案: