is it possible to change the connector of the tree from left to right(Horizontal)

[iceboy07]

Im trying to translate the node horizontally. so i modified the below code " transform: translate(${node.left * (WIDTH / 2)}px, ${ node.top * (HEIGHT / 2) }px)"

              as

"transform:translate(${node.top * (WIDTH / 2)}px, ${ node.left * (HEIGHT / 2) }px)`"

       the node is changed. But the connector/link isnt changing/ transforming. is there any way?

[SanichKotikov]

You can find connector's styles here https://github.com/SanichKotikov/react-family-tree/blob/master/src/connector.tsx#L20 So, if you want to change it, you have to use relatives-tree directly.

[SanichKotikov]

@iceboy07 if you wanna change direction of "tree", you may wrap return result from relatives-tree and correct values.

[iceboy07]

can you specify which file as im new to Typescript. its bit confusing

and is it these lines i need to make changes.. "export const rightOf = (family: Family): number => family.X + widthOf(family); export const bottomOf = (family: Family) => family.Y + heightOf(family);"

[SanichKotikov]

import calcTree from 'relatives-tree';

function changeCoordinates(treeData) {
  // Here you can change the coordinates as you wish and return updated tree data
}

const treeData = calcTree(nodes, { rootId });
const data = changeCoordinates(treeData);