2015-02-23 2 views
0

В настоящее время я работаю над этим примером http://bl.ocks.org/mbostock/4339184 и прошу совета о том, как превратить это дерево в двухстороннее дерево. Причина, по которой я использую эту древовидную структуру, - мои тексты/ярлыки очень длинны и хотят поместить их на одну страницу. Я также попробовал вариант радиального дерева, но длинные метки создают перекрытия с другими метками. Я попытался обернуть некоторый текст в соответствии с параметром с именем size, но не был успешным. Мой код для радиального дерева доступен по этой ссылке http://jsfiddle.net/hv6wc7x5/ Фактические метки, которые я хочу использовать, очень длинны, как показано в ссылке. Я не могу обсуждать этикетки, поскольку это часть исследовательской работы и не может быть показана публично.Как превратить дерево Рейнгольд-Тилфорд в двухстороннее дерево в D3

В принципе я не хочу задавать два вопроса в этом посте. Во-первых, есть ли способ превратить нормальное дерево Рейнгольда-Тилфорда в двухстороннее дерево.

И второй вопрос заключается в том, есть ли способ обернуть текст для выбранных текстов в соответствии с атрибутом размера, указанным в JSON. Код, который я хочу изменить, приведен ниже, но он не работает, если кто-то может помочь мне в исправлении этого, было бы здорово. В последней строке сегмента кода я хочу вызвать функцию wrap (внутренний метод в моем коде) на основе проверки того, что мой размер атрибута равен некоторой ценности, но я не могу это сделать. Может ли кто-нибудь дать мне знать, как я могу улучшить последнюю строку?

node.append("text") 
        .attr("dx", function(d) { return d.x < 180 ? 10 : -10; }) 
        .attr("dy", ".31em") 
        .attr("text-anchor", function(d) { return d.x < 180 ? "start" : "end"; }) 
        .attr("transform", function(d) { return d.x < 180 ? null : "rotate(180)"; }) 
        .text(function(d) { return d.name; }) 
        .attr("wraper", function(d) { return d.size == "3534" ? node.call(wrap,0) : node.call(wrap,0); 
}); 

Было бы здорово, если бы на любой из вышеперечисленных вопросов был дан ответ, хотя я бы с удовольствием ответил на мой первый вопрос.

ответ

0

Я не уверен, что вы подразумеваете под двойным односторонним деревом? Вы имеете в виду два дерева бок о бок? Если это так, вам придется разделить свои данные.

Что касается второго вопроса, не можете ли вы использовать node.filter. фильтровать их через свой «размер» в ваших данных?

+0

Двойным деревом я имею в виду, что корневой узел находится посередине, а ветви - как слева, так и справа. (I-I) вот так. – user3388770

+0

Вот как ваши данные установлены. Если вы хотите разбить его самостоятельно, вам придется разделить данные. –

+0

Можете ли вы показать мне небольшой пример? Если я разделить данные, как ветка дерева будет как в левом, так и в правом направлениях? – user3388770

0

Как было предложено в другом ответе, наилучшим способом действий является разделение данных на «левое» и «правое» дерево. Каждый из этих деревьев имеет общий узел, «корневой узел».

При рендеринге дерева «все» вам нужно сохранить корневые узлы друг на друга.

Смежные вопросы