使用D3的projection.stream()的正确方法是什么? [英] What is the proper way to use D3's projection.stream()?

查看:167
本文介绍了使用D3的projection.stream()的正确方法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

所以我正在尝试用 D3的geo流 API ,感觉有点朦胧。我一直在阅读这里的文档:

So I'm experimenting a bit with D3's geo stream API, and things feel a bit hazy. I've been reading through the documentation here:

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

我有一个混乱的地方是正确的实现的流变换。让我们假设我创建一个:

One point of confusion I have is the proper implementation of stream transforms. Let's say I create one:

//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 引用封装流。但是什么是流,真的?从我可以收集的,它更多是一个过程而不是显式数据结构 - 一系列数据和函数调用来转换数据。上述语法似乎暗示包装的流只是包含流侦听器

Per the documentation, this.stream references the "wrapped stream." But what is the stream, really? From what I can gather, it is more of a procedure than explicit data structure--a sequence of data and function calls to transform the data. The syntax above seems to suggest that the wrapped stream is simply the object containing "stream listeners"

继续,我可以使用投影方法应用流转换:

Moving on, I'm able to apply the stream transform using the projection method:

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

虽然我不太明白底层的力学,效果看起来比较直接:的路径生成器用变换的 x,y 参数调用。

While I don't quite understand the underlying mechanics, the effect seems relatively straightforward: the underlying transform function of the path generator is called with transformed x,y arguments.

对于我的用例,我不觉得这是有帮助的,特别是因为我的输入数据还没有投影。我想使用投影首先变换数据,然后变换那些输出的坐标。为此,是否有一个通用的分层变换模式?

For my use case, I don't find this that helpful, particularly because my input data is not already projected. I'd like to use a projection to transform the data first, then transform those outputted coordinates. To that end, is there a general pattern for layering transforms?

我看到 D3 提供了投影。在应用监听器之前,首先应用投影变换的流(监听器)模式,但是我不知道如何实现。监听器参数应该是什么?以下是一个示例: http://jsfiddle.net/kv7yn8rw/2/

I see that D3 does provide the projection.stream(listener) pattern which applies the projecting transform first, before applying the listener, but I'm not sure how to implement this. What should the listener argument be? Here's an example: http://jsfiddle.net/kv7yn8rw/2/.

任何指导都将非常感谢!

Any guidance would be greatly appreciated!

推荐答案

来自文档
地理位置是流变换的一个示例。

A key fact from the documentation is that "a geographic projection is one example of a stream transform."

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

Streams just allow one to transform (e.g. project) data multiple times without saving the intermediate data. A projection can just be an object with a stream attribute, e.g. proj_then_transform below.

链接流的方法如下:

// 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/

I've updated the example with a working solution: http://jsfiddle.net/cvs5d7o9/2/

这篇关于使用D3的projection.stream()的正确方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆