相关疑难解决方法(0)

我目前正在进行一项小型家谱实验,并希望实现一个简单的家谱,如下图所示.

到目前为止,最好的搜索结果只产生了一个例子,其中一个孩子只能有一个父节点.但我需要的是能够在实体(从父亲到母亲)和节点与其他链接(从子节点到父母链接)之间建立链接.目前我没有固定的数据模式.

我为此选择了d3.js 因为它看起来能够胜任这项工作.我只是不知道如何开始甚至从哪里开始.关于d3.js的教程仅涵盖条形图等标准图表.

我希望有人可以帮助我.

我想用d3.js来构建一个谱系树.

我发现的所有例子都展示了有机树木.

有没有像样式这样的血统的例子吗？

我正在创建一个交互式家谱树创建者,不像更简单的版本,它是简单的谱系图表/树.

我的要求(基于familyecho.com)是:

• 多个合作伙伴与您通常看到的简单2父母对1个孩子.
• 多个兄弟姐妹
• 伙伴们不一定需要生孩子
• 并不总是必须是父母"对",只有一个父亲/母亲

我遇到的问题是:我正在根据"当前"节点/家庭成员生成偏移量,当我越过第一代时,例如2个父母,它重叠.

重叠的示例以及未在同一X轴上绘制的伙伴:

这是我遇到问题的实际app和主js文件.这里是一个简化的jsfiddle我创建演示父/偏移问题,但我真的要解决重叠这个一般,除了确保合作伙伴绘制在同一x轴的其他合作伙伴.

我怎样才能解决这个问题以及未来可能发生的重叠冲突？我是否需要某种重绘功能来检测碰撞并在检测到时调整每个块的偏移？我试图让它无缝,所以重绘的次数有限.

计算相对于"上下文"或当前节点的偏移量的示例:

var offset = getCurrentNodeOffset();

                        if ( relationship == RELATIONSHIPS.PARTNER ) {
                            var t = offset.top; // same level
                            var l = offset.left + ( blockWidth + 25 );
                        } else {
                            var t = offset.top - (blockHeight + 123 ); // higher
                            var l = offset.left - ( blockWidth - 25 );
                        }