2016-03-31 14 views
0

Bir .json dosyasındaki verileri kullanarak d3.js'yi kullanarak bir ağaç ağacı oluşturmaya çalışıyorum. Sahip olduğum sorun, bölüm düğümlerinin x ve dx özniteliklerinin her zaman 0 olarak ayarlanmasıdır. X ve dx değerlerinin aynı derinlikte düğüm sayısına bağlı olarak ayarlanmasını beklerdim. Örneğin. Aşağıdaki örnekte Kadınlar ve Erkekler için .5'lik bir dx değeri olacaktır. Çocuklarının 0.2'si dx olacaktır. Büyük ihtimalle yanlış bir varsayım yapıyorum çünkü bu benim için yeni bir konu. Bu değerlerin neden her zaman 0 olduğu veya değerlerin beklediğim şekilde nasıl ayarlanabileceğine dair herhangi bir anlayışa minnettarım.d3.js partition.nodes (root), x veya dx değerlerini ayarlamaz.

Data.JSON dosyasının içeriği ise:

{ 
"name": "Segment", 
"children": [ 
    { 
    "name": "women", 
    "children": [ 
    { 
    "name": "cluster", 
    "children": [ 
     {"name": "recency: >3months", "size": 3938}, 
     {"name": "recency: between 3 and 6months", "size": 3812} 
    ] 
    }, 
    { 
    "name": "men", 
    "children": [ 
     {"name": "recency: >3months", "size": 3534}, 
     {"name": "recency: between 3 and 6months", "size": 5731} 
    ] 
    } 
    ] 
    } 
] 
} 

Bir d3.layout.partition() için veri ayarlamak için aşağıdaki kodu kullanıyorum:

var partition = d3.layout.partition() 
// .children(function(d) { return isNaN(d.value) ? d3.entries(d.value) : null; }) 
    .value(function(d) { return d.value; }); 

var svg = d3.select("body").append("svg") 
    .attr("width", width) 
    .attr("height", height); 

var rect = svg.selectAll("rect"); 

d3.json("data.json", function(error, root) { 
    if (error) throw error; 
    rect = rect 
     .data(partition.nodes(root)) 
    .enter().append("rect") 
     .attr("x", function(d) { return x(d.x); }) 
     .attr("y", function(d) { return y(d.y); }) 
     .attr("width", function(d) { return x(d.dx); }) 
     .attr("height", function(d) { return y(d.dy); }) 
     .attr("fill", function(d) { return color(d.value); })//d.children ? d : d.parent).key() 
     .on("click", clicked); 
}); 

function clicked(d) { 
    x.domain([d.x, d.x + d.dx]); 
    y.domain([d.y, 1]).range([d.y ? 20 : 0, height]); 

cevap

0

Helsinki Bildirgesi'nin Bunu çözdüm. Json dosyamdaki kelime boyutunu değiştirdim ve x ve dx değerleri ayarlandı.