d3.js - 使用 D3 的projection.stream() 的正确方法是什么？

Question

所以我正在尝试使用 D3's geo stream API ，事情感觉有点朦胧。我一直在阅读这里的文档:

https://github.com/mbostock/d3/wiki/Geo-Streams

我的一个困惑点是流转换的正确实现。假设我创建了一个:

//a stream transform that applies a simple translate [20,5]:
var transform = d3.geo.transform({
    point:function(){this.stream.point(x+20,y+5)}
}) 

根据文档，this.stream 引用了“包装流”。但什么是流，真的吗？据我所知，它更像是一个过程而不是显式的数据结构——用于转换数据的数据和函数调用序列。上面的语法似乎表明包装的流只是包含“ stream listeners”的对象

继续，我可以使用投影方法应用流变换:

//a path generator with the transform applied using the projection() method
var path = d3.geo.path().projection(transform);

虽然我不太了解底层机制，但效果似乎相对简单:路径生成器的底层变换函数是用transformed x,y 调用的。论据。

对于我的用例，我认为这没有帮助，特别是因为我的输入数据尚未投影。我想先使用投影来转换数据，然后再转换那些输出的坐标。为此，是否有分层变换的通用模式？

我看到了 D3确实提供了projection.stream(listener) 模式，该模式在应用监听器之前首先应用投影变换，但我不确定如何实现这一点。听众的论点应该是什么？这是一个例子: http://jsfiddle.net/kv7yn8rw/2/ .

任何指导将不胜感激!

Answer 1

来自 the documentation 的关键事实就是它
“地理投影是流变换的一个例子。”

Streams 只允许多次转换(例如项目)数据而不保存中间数据。投影可以只是具有流属性的对象，例如proj_then_transform以下。

链接流的方式如下:

// stream 1
var proj = d3.geo.equirectangular();
// stream 2
var transform = d3.geo.transform({
    point:function(x,y){this.stream.point(x+20,y+5)}
});
// stream 1 then stream 2
var proj_then_transform = {
        stream: function(s) { 
            return proj.stream(transform.stream(s)); 
        }
     };

我已经用一个有效的解决方案更新了这个例子:
http://jsfiddle.net/cvs5d7o9/2/