From d6b6ca2d4468c57177ec0f3508d1daa17b2230f9 Mon Sep 17 00:00:00 2001 From: "Baruch Odem (Rothkoff)" Date: Thu, 23 Jun 2022 11:32:38 +0300 Subject: [PATCH] Convert x,y to numbers Just throwing it here if someone will fork it and will take it to maintain it for all of us. If you start with the snapshot test in `test/graph/graph.snapshot.spec.js`, you will see the snapshot is weird. Debug it, and you will see the coordinates are `string`s. First of all, it is not good. The bug is in these lines: https://github.com/CheckmarxDev/fusion-react-d3-graph/blob/master/src/components/graph/graph.helper.js#L543 ```javascript x1 += sourceNodeSize * directionVector.x; y1 += sourceNodeSize * directionVector.y; ``` If the `x1` and `y1` are `string`, adding a `number` to them will concatenate the number to the end of the string, and this is why you see coords like `402.6029494893985485,200-4.685309080917388` in the snapshot. --- src/components/graph/graph.builder.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/graph/graph.builder.js b/src/components/graph/graph.builder.js index 73734e62..befe8e94 100644 --- a/src/components/graph/graph.builder.js +++ b/src/components/graph/graph.builder.js @@ -55,10 +55,10 @@ function _getNodeOpacity(node, highlightedNode, highlightedLink, config) { */ function buildLinkProps(link, nodes, links, config, linkCallbacks, highlightedNode, highlightedLink, transform) { const { source, target } = link; - let x1 = nodes?.[source]?.x || 0; - let y1 = nodes?.[source]?.y || 0; - let x2 = nodes?.[target]?.x || 0; - let y2 = nodes?.[target]?.y || 0; + let x1 = +nodes?.[source]?.x || 0; + let y1 = +nodes?.[source]?.y || 0; + let x2 = +nodes?.[target]?.x || 0; + let y2 = +nodes?.[target]?.y || 0; const type = link.type || config.link.type; const selfLinkDirection = link.selfLinkDirection || config.link.selfLinkDirection;