如何使用 D3 从 GeoJSON 数据集中获取投影路径定义字符串（不是 SVG 元素）？

Question

有很多使用 D3 的路径投影工具从 D3 地理数据绘制 SVG 路径的示例。例如，here's one I wrote earlier (D3 v3) and here's a recent example using D3 v4.

它们看起来都像这样：

  svg.append("path")
      .data(topojson.feature(datafile, datafile.objects.featureOfInterest))
      .attr("class", "land")
      .attr("d", pathDefinitionObject);

...读取数据文件并将其与某些 SVG 相关联，创建链接的空路径，然后与某个投影相关联的 D3 路径定义对象查看数据并使用它将 SVG 路径定义字符串添加到这些路径的 d 属性。

我想要的是那些路径定义字符串，但作为字符串，不涉及任何 SVG。我想将这些字符串与 Raphael 一起使用，以便我可以在浏览器上绘制路径不支持 SVG，因为特定项目需要支持机构客户，这些客户由于遗留软件要求和公司政策尚未从 IE8 升级（我知道，我知道...）。

D3 显然能够定义这些字符串，但我看不到一种明显的方法可以让路径定义对象在不链接到 DOM SVG 元素的情况下输出字符串。

如何在页面上没有任何 SVG 的情况下只获取字符串？

我正在尝试为此使用最小的 D3 v4's "microlibraries" 集，因此对于具有最少 D3 依赖性的答案的加分（特别是如果它可以避免 D3-selection.js 这是相当大 - 理想情况下，我只想使用 D3 的数据处理而不使用它的 DOM 操作来完成这个项目。

Answer 1

建立链接的 v4 示例，仅获取陆地路径 d 属性的极简代码为：

<!DOCTYPE html>
<meta charset="utf-8">

<script src="//d3js.org/d3-array.v1.min.js"></script>
<script src="//d3js.org/d3-geo.v1.min.js"></script>
<script src="//d3js.org/d3-request.v1.min.js"></script>
<script src="//d3js.org/d3-dispatch.v1.min.js"></script>
<script src="//d3js.org/d3-collection.v1.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>

<script>

var projection = d3.geoAlbers()
    .scale(1280)
    .translate([500, 500]);

var path = d3.geoPath()
    .projection(projection)
    .pointRadius(1.5);

d3.json("https://gist.githubusercontent.com/mbostock/4090846/raw/d534aba169207548a8a3d670c9c2cc719ff05c47/us.json", function(error, us){
  if (error) throw error;

  var topo = topojson.feature(us, us.objects.land);
  console.log(path(topo));

});

</script>

如果您不使用 d3.json，您可以删除 d3-request、d3-dispatch 和 d3-collection 库。

如何使用 D3 从 GeoJSON 数据集中获取投影路径定义字符串（不是 SVG 元素）？

How to get projected path definition strings (not SVG elements) from a GeoJSON dataset with D3?

geospatial

geojson

d3.js

topojson