Ready to draw filiation links
This commit is contained in:
		@@ -162,8 +162,27 @@ function NodeArea(p: {
 | 
				
			|||||||
  let beginingOfSecondCardX =
 | 
					  let beginingOfSecondCardX =
 | 
				
			||||||
    parent_x_offset + memberCardWidth(p.node.member) + SPOUSE_SPACING;
 | 
					    parent_x_offset + memberCardWidth(p.node.member) + SPOUSE_SPACING;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  let beginSecondFaceX =
 | 
				
			||||||
 | 
					    p.node.spouse &&
 | 
				
			||||||
 | 
					    beginingOfSecondCardX +
 | 
				
			||||||
 | 
					      (memberCardWidth(p.node.spouse.member) - FACE_WIDTH) / 2;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  let middleParentFaceY = p.y + Math.floor(FACE_HEIGHT / 2);
 | 
					  let middleParentFaceY = p.y + Math.floor(FACE_HEIGHT / 2);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  // Compute point for link between children and parent
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  let childrenLinkX: number;
 | 
				
			||||||
 | 
					  let childrenLinkY: number;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  if (p.node.spouse) {
 | 
				
			||||||
 | 
					    childrenLinkX = Math.floor((endFirstFaceX + beginSecondFaceX!) / 2);
 | 
				
			||||||
 | 
					    childrenLinkY = middleParentFaceY;
 | 
				
			||||||
 | 
					  } else {
 | 
				
			||||||
 | 
					    childrenLinkX =
 | 
				
			||||||
 | 
					      parent_x_offset + Math.floor(memberCardWidth(p.node.member) / 2);
 | 
				
			||||||
 | 
					    childrenLinkY = p.y + CARD_HEIGHT;
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
    <>
 | 
					    <>
 | 
				
			||||||
      <MemberCard x={parent_x_offset} y={p.y} member={p.node.member} />
 | 
					      <MemberCard x={parent_x_offset} y={p.y} member={p.node.member} />
 | 
				
			||||||
@@ -175,9 +194,7 @@ function NodeArea(p: {
 | 
				
			|||||||
            className="link"
 | 
					            className="link"
 | 
				
			||||||
            fill="none"
 | 
					            fill="none"
 | 
				
			||||||
            stroke="#000"
 | 
					            stroke="#000"
 | 
				
			||||||
            d={`M${endFirstFaceX} ${middleParentFaceY} H ${
 | 
					            d={`M${endFirstFaceX} ${middleParentFaceY} H ${beginSecondFaceX}`}
 | 
				
			||||||
              beginingOfSecondCardX + memberCardWidth(p.node.spouse.member) / 2
 | 
					 | 
				
			||||||
            }`}
 | 
					 | 
				
			||||||
          ></path>
 | 
					          ></path>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
          <MemberCard
 | 
					          <MemberCard
 | 
				
			||||||
@@ -199,6 +216,8 @@ function NodeArea(p: {
 | 
				
			|||||||
        downXOffset += n.width + SIBLINGS_SPACING;
 | 
					        downXOffset += n.width + SIBLINGS_SPACING;
 | 
				
			||||||
        return el;
 | 
					        return el;
 | 
				
			||||||
      })}
 | 
					      })}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      {/*<circle cx={childrenLinkX} cy={childrenLinkY} r="2" fill="red" />*/}
 | 
				
			||||||
    </>
 | 
					    </>
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user