4

ハイ

geojson から d3.v3.js で svg を描画しようとしています。私はopenstreetmap(私のテストデータ:http://pastebin.com/4GQne42i)からgeojsonを取得し、それをsvgにレンダリングしようとします。

私のJSコード:

var path, vis, xy, jdata;

    xy = d3.geo.mercator().translate([0, 0]).scale(200);

    path = d3.geo.path().projection(xy);

    vis = d3.select("body").append("svg").attr("width", 960).attr("height", 600);

    //22.json is the name of the file which contains the geojson data
    d3.json("22.json", function(error, json) { 
      jdata = json;
      if(error!=null)
    console.log(error);
      return vis.append("svg:g")
          .selectAll("path")
          .data(json.coordinates)
          .enter().append("path")
          .attr("d", path);
    });

そしてどういうわけか私のsvg結果はこれです:

<svg width="960" height="600">
 <g>
  <path></path>
 </g>
</svg>

投影が良くないことはわかっていますが、svg にはノードが必要だと思います。

私のコードの問題は何ですか? 正しい解決策を投稿しますか?

4

2 に答える 2

1

本当にD3でそれをする必要がありますか?

次のようなマップ指向のライブラリを使用することをお勧めします。

リーフレット ベクター レイヤーは GeoJSON をサポートしており、そのサイズは非常にコンパクトです。

Open Layers もオプションですが、サイズがかなり大きいです。

Leaflet + GeoJSON を使用して郊外の形状を表示する方法の例を次に示します http://www.geolocation.ws/s/6798/en

于 2013-05-13T03:41:48.703 に答える