1

我正在尝试更新同一个 div 中的 4 个制图。

首先,我创建了 4 个原始地图,每个地图都有自己的 svg,如下所示:

function makeMaps(data){
  var mapsWrapper = d3.select('#maps');
  data.forEach(function(topoJSON,i){
  var quantize = d3.scale.quantize()
  .domain([0, 1600000])
  .range(d3.range(5).map(function(i) { return "q" + i; }));

  var layer = Object.keys(topoJSON.objects)[0]
  var svg = mapsWrapper.append('svg')
    .attr("class","mapa")
    .attr({
        width: "350px",
        height: "350px"
    });

  var muns = svg.append("g")
    .attr("class", "muns")
    .attr("id",layer)
    .selectAll("path");

  var geometry = topoJSON.objects[layer].geometries;
  var carto = cartos[i]
  var features = carto.features(topoJSON, geometry),
    path = d3.geo.path()
      .projection(projections[i]);

  muns.data(features)
    .enter()
    .append("path")
    .attr("class", function(d) {
      return quantize(d.properties['POB1']);
    })
    .attr("d", path);

 });
}

这部分效果很好,并创建了 4 个地图。在此之后,我想用 Cartogram.js 计算的路径更新每个地图中的路径。问题是我无法获取每个地图中的路径数据,这就是我想要做的:

...some code to calculate cartogram values
var cartograms = d3.selectAll(".mapa").selectAll("g").selectAll("path")
cartograms.forEach(function(region,i){
  region.data(carto_features[i])
      .select("title")
      .text(function (d) {
        return d.properties.nom_mun+ ': '+d.properties[year];
      });

cartograms我得到一个嵌套选择:每个地图的路径数组,这是我虽然需要的,但在里面forEach我得到错误 region.data() is not a function。每个区域都是一个路径数组,每个路径都有一个数据属性。我尝试了几种选择路径的方法都无济于事,现在我有点迷路了。谢谢你的帮助

4

0 回答 0