summaryrefslogtreecommitdiff
path: root/app/components/graph/3d.tsx
blob: a539d8cbb61efda32bcc5de0c7c5121994af07ff (about) (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62

          ref={fgRef}
          //graphData={!physics.local ? gData : localGraphData }
          graphData={gData}
          nodeAutoColorBy={physics.colorful ? "id" : undefined}
          nodeColor={
            !physics.colorful
              ? (node) => {
                  if (highlightNodes.size === 0) {
                    return "rgb(100, 100, 100, 1)"
                  } else {
                    return highlightNodes.has(node) ? "purple" : "rgb(50, 50, 50, 0.5)"
                  }
                }
              : undefined
          }
          linkAutoColorBy={physics.colorful ? "target" : undefined}
          //linkAutoColorBy={(d) => gData.nodes[d.source].id % GROUPS}
          linkColor={
            !physics.colorful
              ? (link) => {
                  if (highlightLinks.size === 0) {
                    return "rgb(50, 50, 50, 0.8)"
                  } else {
                    return highlightLinks.has(link) ? "purple" : "rgb(50, 50, 50, 0.2)"
                  }
                }
              : undefined
          }
          linkDirectionalParticles={physics.particles}
          nodeLabel={(node) => node.title}
          linkWidth={(link) =>
            highlightLinks.has(link) ? 3 * physics.linkWidth : physics.linkWidth
          }
          linkOpacity={physics.linkOpacity}
          nodeRelSize={physics.nodeRel}
          nodeVal={(node) =>
            highlightNodes.has(node) ? node.neighbors.length + 5 : node.neighbors.length + 3
          }
          linkDirectionalParticleWidth={physics.particleWidth}
          onNodeHover={physics.hover ? handleNodeHover : null}
          d3AlphaDecay={physics.alphaDecay}
          d3AlphaMin={physics.alphaTarget}
          d3VelocityDecay={physics.velocityDecay}
          nodeThreeObject={
            !physics.labels
              ? undefined
              : (node) => {
                  if (highlightNodes.has(node)) {
                    console.log(node.title)
                    const sprite = new SpriteText(node.title.substring(0, 30))
                    console.log("didnt crash here 2")
                    sprite.color = "#ffffff"
                    sprite.textHeight = 8
                    return sprite
                  } else {
                    return undefined
                  }
                }
          }
          nodeThreeObjectExtend={true}
          onNodeClick={selectClick}