D3 ile çalışan bir GeoJSON nasıl oluşturulur?

Sadece kullanarak .shp dosyasını geoJSON biçimine dönüştürmek çalışıyorum:

ogr2ogr -f geoJSON output.json input.shp

Komutu uyguladıktan sonra hiçbir şey yanlış görünmüyor. İşte çıktıdan bir alıntı. Json

    {
    "type": "FeatureCollection",

    "features": [
    { "type": "Feature", 
    "properties": { "ID_0": 86, "ISO": "DEU", "NAME_0": "Germany", "ID_1": 1, "NAME_1": "Baden-Württemberg", "NL_NAME_1": null, "VARNAME_1": null, "TYPE_1": "Land", "ENGTYPE_1": "State" }, 
    "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ 8.708400940398242, 47.715581894910606 ], [ 8.713716147005524, 47.701734382960055 ], 
...

Ama ben SVG çokgenler çizmek için de JSON dosyasını d3 (http://d3js.org/) kullanmaya çalıştığınızda çıktı sadece yanlış. Shp dosyaları QGIS'de doğru bir şekilde görüntülendiğinden, kullanım şeklimde yanlış bir şey olması gerektiğini düşünüyorum ogr2ogr. Aldığım SVG tamamen yanlış değil ama bulamadığım bir ayrıntı var gibi görünüyor. Baş aşağı çevrilmiş ve bir şekilde iki ayrı parçaya ayrılmış gibi görünüyor.

Svg oluşturmak için kullanılan javaScript:

//dimensions
var w = 2000;
var h = 2000;

var svg = d3.select("#chart").append("svg")
    .attr("width", w)
    .attr("height", h);

    d3.json(
    "http://localhost:8888/data/data.json",
    function (json) {

    var path = d3.geo.path();

    svg.append("g")
        .attr("class", "black")
        .selectAll("path")
        .data(json.features)
        .enter()
        .append("path")
        .attr("d", path);

Burada neyin yanlış gittiğine dair bir fikri olan var mı? Ayrıca shp dosyasını Qgis ve myGeodata (http://converter.mygeodata.eu/vector) kullanarak dönüştürmeyi denedim. Ama ikisi de olması gerektiği gibi çalışmıyor.

Bu haritacılık işlerinde çok yeniyim. Bu yüzden tavsiye almaktan çok memnun olurum.

Çok teşekkürler!

Tamam, d3'te farklı projeksiyonlar, ölçekler ve çevirilerle oynamak sorunumu çözdü. D3.geo.path () kullanılırken varsayılan projeksiyon albersUsa olduğundan, diğer bazı projeksiyonları denemek için iyi bir neden vardı. Şekil dosyasını dönüştürürken doğru EPSG spesifikasyonunu kullanarak sorunun daha kolay çözülebileceğini düşünüyorum, ancak bu belirsiz sayılar bilgimi aştı.

Sonunda yaptığım şey sadece bir mercator projeksiyonu kullanmak ve translate () ile svg-viewport'a getirmek.

   d3.json(
    "http://localhost:8888/data/data.json",
    function (json) {

    //dimensions
    var w = 2000;
    var h = 2000;

    var svg = d3.select("#chart").append("svg")
    .attr("width", w)
    .attr("height", h);

    //create geo.path object, set the projection to merator bring it to the svg-viewport
    var path = d3.geo.path()
        .projection(d3.geo.mercator()
        .scale(20000)
        .translate([0, 3800]));

    //draw svg lines of the boundries
    svg.append("g")
        .attr("class", "black")
        .selectAll("path")
        .data(json.features)
        .enter()
        .append("path")
        .attr("d", path);
    });

İşte kullandığım şekil dosyaları ve ortaya çıkan geoJSON için bir bağlantı . Ben aldığım shapefiles, basitleştirmek için GADM , kullandığım mapshaper .

Yine de daha az zahmetli ve daha esnek bir çözümle ilgilenecektim. Herkesin bir fikri varsa, şimdiden teşekkürler! Ama şimdilik Almanya'nın 16 Bundesländer'ini tanıyabildiğim için mutluyum!

shapefile ve GeoJSON çıktılarınız için doğru EPSG kodunu belirlemeyi denediniz mi? Örneğin:

ogr2ogr -f GeoJSON -s_srs EPSG:.... -t_srs EPSG:.... output.json input.shp

Haklısınız, bir almanya haritası için ABD projesine uyduğu için varsayılan projeksiyonu değiştirmeniz gerekir. Kansas'ta bir yerde ve 960x boyutunda bir harita için ortalanmış.

Elbette doğru parametreler harita boyutlarınıza da bağlıdır.

D3.geo.albers projeksiyonunu ( coropleth haritaları için en iyisi ) kullanmak istiyorsanız, parametrelerim şunlardır:

var w = 415;
var h = 555;

var albers = d3.geo.albers()
    .origin([11, 51])
    .parallels([49, 53])
    .translate([230, 290])
    .scale(4000);

var path = d3.geo.path().projection(albers);