28

だから私は で少し実験していてD3's geo stream API、物事は少しぼんやりしています。ここのドキュメントを読んでいます：

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

私が混乱している点の 1 つは、ストリーム変換の適切な実装です。私が作成したとしましょう：

//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は「ラップされたストリーム」を参照しています。しかし、実際にはストリームとは何ですか？私が収集できるものからすると、これは明示的なデータ構造というよりも、一連のデータとデータを変換するための関数呼び出しのような手順です。上記の構文は、ラップされたストリームが単に「ストリームリスナー」 を含むオブジェクトであることを示唆しているようです

次に進むと、射影法を使用してストリーム変換を適用できます。

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

根底にあるメカニズムはよくわかりませんが、その効果は比較的単純に思えます。パス ジェネレーターの根底にある変換関数は、変換されたx,y引数で呼び出されます。

私の使用例では、特に入力データがまだ投影されていないため、これはあまり役に立ちません。最初に投影を使用してデータを変換し、次に出力された座標を変換したいと思います。そのために、トランスフォームをレイヤー化するための一般的なパターンはありますか?

D3リスナーを適用する前に、最初に射影変換を適用するProjection.stream( listener ) パターンを提供していることがわかりますが、これを実装する方法がわかりません。リスナーの引数は何にする必要がありますか? 例を次に示します: http://jsfiddle.net/kv7yn8rw/2/。

どんなガイダンスも大歓迎です！

4

1 に答える 1

6

ドキュメントの重要な事実は、「地理的投影はストリーム変換の一例です」ということです。

ストリームを使用すると、中間データを保存せずに、データを複数回変換 (たとえば、投影) することができます。プロジェクションは、以下の例のように、ストリーム属性を持つオブジェクトにすることができ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/

于 2015-07-27T07:22:40.077 に答える