Как создать спутниковые узлы в главном узле в графах компоновки D3.js

Question

Я пытаюсь создать узлы спутника для узлов основного графика под маской силовой структуры. Каждый узел должен иметь один или несколько соответствующих подключенных к нему узлов соответствующего узла.

Вот jsfiddle, который показывает намерение (этот пример имеет фиксированное положение и никакой силы правящей спутниковый узел

http://jsfiddle.net/guidoextras/zLt2sne3/1/

 node.append("circle") 
     .attr("class", "planet_node") 
     .attr("r", function(d) { return d.weight * 2 + 12; }) 
     .style("fill", function(d) { return color(1/d.rating); }); 


    node.append("circle") 
     .attr("r", 5) 
     .attr("class", "satellite_node") 
     .attr("cx", function(d) { return d.weight * 2 + 25; }) 
     .attr("cy", 0) 
     .style("stroke-width", "1") 
     .style("stroke", "black") 
     .style("fill", "cyan"); 

Спутниковые узлы должны:.

• быть прикрепленный к основному узлу по линии связи на фиксированном более коротком расстоянии. Расстояние связи должно быть фиксированным.
• быть под силой, которая приходит из своего основного узла (планеты) и не подвергается влиянию других (это, вероятно, не должно быть проблемой, если расстояние связи всегда фиксировано)
• , когда для одного и того же планетного узла существует больше узлов спутника, ожидается, что они могут оттолкнуть друг друга, чтобы они не занимали одну и ту же позицию.

Я имею в виду, что для достижения этой цели я должен:

• рассмотреть все спутниковые узлы, как обычные узлы в одних и тех же наборов данных
• соблюдение linkdistance связей между спутниковыми узлами и планеты узлов в быть короче (или фиксированная) < - не знаю, как это можно сделать на конкретных ссылок/узлов

Answer 1

Это мой вывод:

1) создавать узлы обычно к узлам спутника

2) при создании данных Link [] между узлами определите свойство «тип» и установите его для «планеты» для связей между планетами и «спутник» для ссылок между спутниковым узлом и его планетой

node[0] = {"name":"planet-1"} 
node[1] = {"name":"satellite-to-planet-1"} 
node[2] = {"name":"planet2"} 
node[3] = {"name":"planet3"} 

link[0] = {"source":0, "target":1, "type":"SATELLITE"} 
link[1] = {"source":2, "target":3, "type":"PLANET"} 

3) установить свойство макета силы следующим образом:

this.force = d3.layout.force() 
    .nodes(this.nodes) 
    .links(this.links) 
    .charge(-400) 
    .linkDistance(function (d) { return (d.type == "SATELLITE" ? "10" : 120) }) 
    .size([this.w, this.h]) 
    .on("tick", tick); 

Это принуждает планету-спутник ссылка быть короче, чем другие