diff --git a/package-lock.json b/package-lock.json index 3f7294f6..cd17ae79 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,6 +22,7 @@ "@kamiya4047/eslint-plugin-pretty-import": "^0.1.6", "@sentry/vite-plugin": "^4.8.0", "@sentry/vue": "^10.38.0", + "@sigma/edge-curve": "^3.1.0", "@sigma/node-border": "^3.0.0", "@tailwindcss/vite": "^4.1.18", "@tanstack/vue-table": "^8.21.3", @@ -4707,6 +4708,16 @@ } } }, + "node_modules/@sigma/edge-curve": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/@sigma/edge-curve/-/edge-curve-3.1.0.tgz", + "integrity": "sha512-OFWkfAXEsm+X8l1K4K49cC0psB0gQ+gqxKA08HG5piNPdzrDZ5gG9Gza6htZ5AirOVwd/4/uq/gPpD5En+H+3Q==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "sigma": ">=3.0.0-beta.10" + } + }, "node_modules/@sigma/node-border": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/@sigma/node-border/-/node-border-3.0.0.tgz", diff --git a/package.json b/package.json index 1a57962a..8da4b0e2 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ "@sentry/vite-plugin": "^4.8.0", "@sentry/vue": "^10.38.0", "@sigma/node-border": "^3.0.0", + "@sigma/edge-curve": "^3.1.0", "@tailwindcss/vite": "^4.1.18", "@tanstack/vue-table": "^8.21.3", "@tanstack/vue-virtual": "^3.13.18", @@ -187,4 +188,4 @@ "hazardous": "^0.3.0", "node-api-dotnet": "^0.9.19" } -} +} \ No newline at end of file diff --git a/src/localization/en.json b/src/localization/en.json index 2af6a1d0..8eac02a1 100644 --- a/src/localization/en.json +++ b/src/localization/en.json @@ -393,6 +393,15 @@ "mutual_friends_count": "Mutual friends: {count}", "edge": "{source} ↔ {target}" }, + "settings": { + "title": "Graph Layout Settings", + "layout_iterations": "Layout iterations", + "layout_iterations_help": "How long the layout runs. Higher means more stable and organized.", + "layout_spacing": "Layout spacing", + "layout_spacing_help": "How spread out the graph is. Higher means less crowded.", + "edge_curvature": "Edge curvature", + "edge_curvature_help": "How curved the lines are. Higher means smoother lines in dense areas." + }, "force_dialog": { "open_label": "Adjust graph layout settings", "title": "Graph Layout Settings", diff --git a/src/views/Charts/components/MutualFriends.vue b/src/views/Charts/components/MutualFriends.vue index 9aaf7b96..1be59ccf 100644 --- a/src/views/Charts/components/MutualFriends.vue +++ b/src/views/Charts/components/MutualFriends.vue @@ -23,14 +23,101 @@ -
+ {{ t('view.charts.mutual_friend.settings.layout_iterations_help') }} +
++ {{ t('view.charts.mutual_friend.settings.layout_spacing_help') }} +
++ {{ t('view.charts.mutual_friend.settings.edge_curvature_help') }} +
+