D3でGeoJSONデータセットから投影されたパス定義文字列（SVG要素ではない）を取得する方法は？

D3のパス投影ツールを使用して、D3ジオデータからSVGパスを描画する例はたくさんあります。たとえば、here's one I wrote earlier (D3 v3)となり、ここではrecent example using D3 v4となります。D3でGeoJSONデータセットから投影されたパス定義文字列（SVG要素ではない）を取得する方法は？

は、彼らはすべて、このようになります。データファイルがリンクされ、空のパスを作成し、読み、いくつかのSVGに関連付けられている

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

...、その後、特定の投影ルックスに関連したD3パス定義オブジェクトそのデータのSVGパス定義文字列をこれらのパスの属性のdに追加します。

私が望むのは、パス定義文字列ですが、文字列としてSVGに触れることはありません。私はSVGをサポートしていないブラウザでパスを描くことができるように、これらの文字列をRaphaelで使用したいのですが、特定のプロジェクトではレガシーソフトウェア要件と企業ポリシーがIE8からアップグレードされていない、知っている...）。

D3は明らかにこれらの文字列を定義できますが、パス定義オブジェクトを取得してDOM SVG要素にリンクさせずに文字列を出力することはできません。

ページ上にSVGなしで文字列を取得するにはどうすればよいですか？

私はそれが非常に大きいD3-selection.jsを避けることができる場合は特に、最も少ないD3の依存関係（と答えを最小限に抑え、このためD3 v4's "microlibraries"のセットなので、ボーナスポイントを使用しようとしている - 理想的に私はこのプロジェクトではD3のデータ処理のみを使用し、DOM操作はまったく使用しません）。ちょうど土地のパスを取得するにはミニマリストのコードをオフにあなたのリンクv4例のビルド

出典

2016-07-27 user568458

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ライブラリをドロップすることができます。

出典

2016-07-27 13:31:31 Mark

素晴らしい！私がしなければならなかったのは、geojsonオブジェクトをパスオブジェクトに渡すことでした！これは、featureCollection内のすべての機能の1つのメガストリングを1つの 'M ... ZM ... ZM ... Z'複合文字列に出力しますが、' topo.features'の周りに 'for'ループを実行するのは簡単です。それらを分ける – user568458

D3でGeoJSONデータセットから投影されたパス定義文字列（SVG要素ではない）を取得する方法は？

答えて

関連する問題