score:1

From the text as nodes documentation, looks like you can create three.js sprites. From the documentation you can see how to load an image. Putting it together:

<head>
  <style> body { margin: 0 } </style>

  <script src="//unpkg.com/three"></script>
  <script src="//unpkg.com/three-spritetext"></script>

  <script src="//unpkg.com/3d-force-graph"></script>
</head>

<body>
  <div id="3d-graph"></div>

  <script>
    const Graph = ForceGraph3D()
      (document.getElementById('3d-graph'))
        .jsonUrl('//rawgit.com/vasturiano/3d-force-graph/master/example/datasets/miserables.json')
        .nodeAutoColorBy('group')
        .nodeThreeObject(node => {
          var map = new THREE.TextureLoader().load( "https://picsum.photos/100/100/?random" );
          map.minFilter = THREE.LinearFilter;
          var material = new THREE.SpriteMaterial( { map: map } );
          var sprite =  new THREE.Sprite( material );
          sprite.scale.set(32,32,1);
          return sprite;
        });
    // Spread nodes a little wider
    Graph.d3Force('charge').strength(-150);
  </script>
</body>


Related Query