+35
-2
projects/homepage/src/components/Graph.tsx
+35
-2
projects/homepage/src/components/Graph.tsx
···
7
7
icon?: string;
8
8
color?: string;
9
9
desc?: string;
10
+
opacity?: number;
10
11
x?: number;
11
12
y?: number;
12
13
z?: number;
···
54
55
icon: "immerse.avif",
55
56
},
56
57
{
58
+
id: "Blue",
59
+
desc: "Blue Ball",
60
+
color: "#0000ff",
61
+
url: "https://googleballs.com",
62
+
opacity: 1,
63
+
},
64
+
{
65
+
id: "Red",
66
+
desc: "Red Ball",
67
+
color: "#ff0000",
68
+
url: "https://googleballs.com",
69
+
opacity: 1,
70
+
},
71
+
{
72
+
id: "Yellow",
73
+
desc: "Yellow Ball",
74
+
color: "#ffff00",
75
+
url: "https://googleballs.com",
76
+
opacity: 1,
77
+
},
78
+
{
79
+
id: "Green",
80
+
desc: "Green Ball",
81
+
color: "#00ff00",
82
+
url: "https://googleballs.com",
83
+
opacity: 1,
84
+
},
85
+
{
57
86
id: "Give",
58
87
desc: "Give",
59
88
icon: "give.avif",
···
188
217
{ source: "Niclas Overby", target: "Connect" },
189
218
{ source: "Niclas Overby", target: "Immerse" },
190
219
{ source: "Niclas Overby", target: "Give" },
191
-
{ source: "Connect", target: "Matrix" },
220
+
{ source: "Niclas Overby", target: "Blue" },
221
+
{ source: "Blue", target: "Red" },
222
+
{ source: "Red", target: "Yellow" },
223
+
{ source: "Yellow", target: "Green" },
192
224
{ source: "Connect", target: "Mail" },
225
+
{ source: "Connect", target: "Matrix" },
193
226
{ source: "Connect", target: "LinkedIn" },
194
227
{ source: "Connect", target: "Mastodon" },
195
228
{ source: "Connect", target: "PixelFed" },
···
272
305
new THREE.MeshLambertMaterial({
273
306
color: node.color,
274
307
transparent: true,
275
-
opacity: 0.4,
308
+
opacity: node.opacity ?? 0.4,
276
309
}),
277
310
),
278
311
);