Принудительная компоновка D3 по размеру узла

Я пытаюсь создать визуализацию с помощью D3, чтобы узлы имели разный размер по определенному атрибуту, а большие узлы уходили в центр, а меньшие узлы уходили наружу. У меня работают размеры, кластеризация и обнаружение столкновений, но я не могу понять, как указать большим узлам идти в центр.

Я пытался возиться с зарядом, но не смог убедить, что это сработает. Я получил linkDistance, чтобы переместить большие в центр, но (а) добраться туда было ОЧЕНЬ нервно и (б) меньшие находятся далеко снаружи, а не плотно упакованы. linkDistance все еще находится в коде, просто закомментирован.

Он доступен по адресу http://pokedex.mrh.is/stats/index.html. :

введите здесь описание изображения

Соответствующий код (я предполагаю) также ниже. Размер узлов определяется их атрибутом attr. О, и узлы - это покемоны.

force = d3.layout.force()
// .gravity(0.05)
// .charge(function(d, i) { return d.attr; })
// .linkDistance(function(d) {
//   return 50000/Math.pow(d.source.attr+d.target.attr,1);
// })
.nodes(pokemon)
// .links(links)
.size([$(window).width(), $(window).height()]);

person mrh.is    schedule 02.05.2013    source источник
comment
Я думаю, вы были довольно близки - попробуйте то, что вы сделали с charge() для gravity().   -  person Andrew    schedule 03.05.2013


Ответы (1)


Следующее дало мне менее нервную версию того, что у вас есть сейчас.

force = d3.layout.force()
    .gravity(0.1)
    .charge(function(d, i) { return -d[selectedAttr]})
    .friction(0.9)
    .nodes(pokemon)
    .size([$(window).width(), $(window).height()]);

Чтобы ответить на ваш актуальный вопрос, координаты каждого узла в настоящее время размещаются на вашем графике случайным образом. Я цитирую документацию по D3:

Когда узлы добавляются к силовому макету, если для них еще не установлены атрибуты x и y, то эти атрибуты инициализируются с использованием равномерного случайного распределения в диапазоне [0, x] и [0, y] соответственно.

По моему опыту, не существует волшебного метода force, который перемещает нужные узлы в центр карты. Способ, которым я добился желаемого результата в прошлом, заключался в замене рандомизированных координат каждого узла координатами, которые размещают узлы в желаемом порядке, расширяясь от центра карты.

person Walter Roman    schedule 21.12.2013