diff options
Diffstat (limited to 'components')
| -rw-r--r-- | components/Tweaks/NodesNLinksPanel.tsx | 2 | ||||
| -rw-r--r-- | components/Tweaks/PhysicsPanel.tsx | 56 | ||||
| -rw-r--r-- | components/config.ts | 8 |
3 files changed, 33 insertions, 33 deletions
diff --git a/components/Tweaks/NodesNLinksPanel.tsx b/components/Tweaks/NodesNLinksPanel.tsx index dba927c..3321ae3 100644 --- a/components/Tweaks/NodesNLinksPanel.tsx +++ b/components/Tweaks/NodesNLinksPanel.tsx @@ -28,7 +28,7 @@ export const NodesNLinksPanel = (props: NodesNLinksPanelProps) => { onChange={(value) => setVisuals({ ...visuals, nodeRel: value })} /> <SliderWithInfo - label="Node connections size scale" + label="Node degree size multiplier" value={visuals.nodeSizeLinks} min={0} max={2} diff --git a/components/Tweaks/PhysicsPanel.tsx b/components/Tweaks/PhysicsPanel.tsx index 05fdba8..cd18f03 100644 --- a/components/Tweaks/PhysicsPanel.tsx +++ b/components/Tweaks/PhysicsPanel.tsx @@ -65,37 +65,15 @@ export const PhysicsPanel = (props: PhysicsPanelProps) => { onChange={(v) => setPhysicsCallback(v, 'charge', -1 / 100)} label="Repulsive Force" /> - <EnableSection - label="Collision" - infoText="Perfomance sap, disable if slow" - value={physics.collision} - onChange={() => setPhysics({ ...physics, collision: !physics.collision })} - > - <SliderWithInfo - value={physics.collisionStrength / 5} - onChange={(v) => setPhysicsCallback(v, 'collisionStrength', 1 / 5)} - label="Collision Radius" - infoText="Easy with this one, high values can lead to a real jiggly mess" - /> - </EnableSection> <SliderWithInfo value={physics.linkStrength * 5} onChange={(v) => setPhysicsCallback(v, 'linkStrength', 5)} label="Link Force" /> <SliderWithInfo - label="Link Iterations" - value={physics.linkIts} - onChange={(v) => setPhysicsCallback(v, 'linkIts', 1)} - min={0} - max={6} - step={1} - infoText="How many links down the line the physics of a single node affects (Slow)" - /> - <SliderWithInfo - label="Viscosity" - value={physics.velocityDecay * 10} - onChange={(v) => setPhysicsCallback(v, 'velocityDecay', 10)} + label="Stabilization rate" + value={physics.alphaDecay * 50} + onChange={(v) => setPhysicsCallback(v, 'alphaDecay', 50)} /> </VStack> <Box> @@ -114,10 +92,32 @@ export const PhysicsPanel = (props: PhysicsPanelProps) => { paddingLeft={3} color="gray.800" > + <EnableSection + label="Collision" + infoText="Perfomance sap, disable if slow" + value={physics.collision} + onChange={() => setPhysics({ ...physics, collision: !physics.collision })} + > + <SliderWithInfo + value={physics.collisionStrength / 5} + onChange={(v) => setPhysicsCallback(v, 'collisionStrength', 1 / 5)} + label="Collision Radius" + infoText="Easy with this one, high values can lead to a real jiggly mess" + /> + </EnableSection> + <SliderWithInfo + label="Link iterations" + value={physics.linkIts} + onChange={(v) => setPhysicsCallback(v, 'linkIts', 1)} + min={0} + max={6} + step={1} + infoText="How many links down the line the physics of a single node affects (Slow)" + /> <SliderWithInfo - label="Stabilization rate" - value={physics.alphaDecay * 50} - onChange={(v) => setPhysicsCallback(v, 'alphaDecay', 50)} + label="Viscosity" + value={physics.velocityDecay * 10} + onChange={(v) => setPhysicsCallback(v, 'velocityDecay', 10)} /> <EnableSection label="Center nodes" diff --git a/components/config.ts b/components/config.ts index a5d859e..32a4c21 100644 --- a/components/config.ts +++ b/components/config.ts @@ -56,11 +56,11 @@ export const initialVisuals = { arrowsColor: '', linkOpacity: 0.8, linkWidth: 1, - nodeRel: 4, + nodeRel: 3, nodeOpacity: 1, nodeResolution: 12, labels: 2, - labelScale: 1, + labelScale: 1.5, labelFontSize: 10, labelLength: 40, labelWordWrap: 25, @@ -69,12 +69,12 @@ export const initialVisuals = { labelDynamicStrength: 0.5, highlight: true, highlightNodeSize: 1.1, - highlightLinkSize: 1, + highlightLinkSize: 0.7, highlightFade: 0.8, highlightAnim: true, animationSpeed: 360, algorithmOptions: options, - algorithmName: 'SinusoidalOut', + algorithmName: 'CircularOut', linkColorScheme: 'gray.500', nodeColorScheme: [ 'red.500', |