From d1a7d3c00a603cb774697e49696e9a0d2c4661b9 Mon Sep 17 00:00:00 2001 From: "Thomas F. K. Jorna" Date: Thu, 5 Aug 2021 22:25:21 +0200 Subject: feature: added slider for node scale --- components/config.ts | 1 + components/tweaks.tsx | 7 +++++++ pages/index.tsx | 12 +++++++++++- 3 files changed, 19 insertions(+), 1 deletion(-) diff --git a/components/config.ts b/components/config.ts index daf548c..2487168 100644 --- a/components/config.ts +++ b/components/config.ts @@ -95,6 +95,7 @@ export const initialVisuals = { refLinkColor: 'gray.400', refLinkHighlightColor: '', refNodeColor: 'black', + nodeSizeLinks: 2, } export interface TagColors { diff --git a/components/tweaks.tsx b/components/tweaks.tsx index 9ff994e..bed075f 100644 --- a/components/tweaks.tsx +++ b/components/tweaks.tsx @@ -711,6 +711,13 @@ export const Tweaks = (props: TweakProps) => { value={visuals.nodeRel} onChange={(value) => setVisuals({ ...visuals, nodeRel: value })} /> + setVisuals({ ...visuals, nodeSizeLinks: value })} + /> {threeDim && ( <> { + const isHighlightingHappening = !!highlightedNodes.length const needsHighlighting = highlightedNodes[node.id!] || previouslyHighlightedNodes[node.id!] // if we are matching the node color and don't have a highlight color // or we don't have our own scheme and we're not being highlighted @@ -879,7 +882,11 @@ export const Graph = forwardRef(function (props: GraphProps, graphRef: any) { const parentNeighbors = links.length ? links.filter((link) => link.type === 'parent').length : 0 - const basicSize = 3 + links.length - (!filter.parents ? parentNeighbors : 0) + const basicSize = + 3 + links.length * visuals.nodeSizeLinks - (!filter.parents ? parentNeighbors : 0) + if (visuals.highlightNodeSize === 1) { + return basicSize + } const highlightSize = highlightedNodes[node.id!] || previouslyHighlightedNodes[node.id!] ? 1 + opacity * (visuals.highlightNodeSize - 1) @@ -983,6 +990,9 @@ export const Graph = forwardRef(function (props: GraphProps, graphRef: any) { return getLinkColor(sourceId as string, targetId as string, needsHighlighting) }, linkWidth: (link) => { + if (visuals.highlightLinkSize === 1) { + return visuals.linkWidth + } const linkIsHighlighted = isLinkRelatedToNode(link, centralHighlightedNode.current) const linkWasHighlighted = isLinkRelatedToNode(link, lastHoverNode.current) -- cgit v1.2.3