Added environment/skybox image rendering

graph.js

@@ -5,7 +5,7 @@ let hoverNode = null;
 
 const Graph = ForceGraph3D()
 (document.getElementById('3d-graph'))
-    .jsonUrl(dataset)
+    .jsonUrl(plugin_path + 'datasets/miserables.json')
     .nodeLabel('id')
     .nodeAutoColorBy('group')
     .nodeColor(node => highlightNodes.has(node) ? node === hoverNode ? 'rgb(255,0,0,1)' : 'rgba(255,160,0,0.8)' : 'rgba(0,255,255,0.6)')
@@ -14,6 +14,17 @@ const Graph = ForceGraph3D()
     .onNodeHover(nodeHover)
     .onLinkHover(linkHover);
 
+const sphereGeometry = new THREE.SphereGeometry(10000, 32, 32);
+//const planeGeometry = new THREE.PlaneGeometry(1000, 1000, 1, 1);
+const loader = new THREE.TextureLoader();
+//const planeMaterial = new THREE.MeshLambertMaterial({color: 0xFF0000, side: THREE.DoubleSide}); //THREE.BackSide
+const planeMaterial = new THREE.MeshBasicMaterial({map: loader.load(plugin_path + 'background.jpg'), side: THREE.DoubleSide}); //THREE.BackSide
+const mesh = new THREE.Mesh(sphereGeometry, planeMaterial);
+mesh.position.set(0, 0, 0);
+//mesh.rotation.set(0.5 * Math.PI, 0, 0);
+
+Graph.scene().add(mesh);
+
 
 function updateLinks() {
     gData = Graph.graphData();

knowledge-space.php

@@ -10,16 +10,17 @@ Author: Matthias Konitzny
 function ks_add_graph(): string
 {
     $graph = '<script src="//unpkg.com/3d-force-graph"></script>';
+    $three = '<script src="//unpkg.com/three"></script>';
     $div = '<div id="3d-graph"></div>';
     $plugin_dir = plugin_dir_url(__FILE__);
-    $dataset = $plugin_dir.'datasets/miserables.json';
+    //$dataset = $plugin_dir.'datasets/miserables.json';
     $variables = "<script> 
-                  var dataset = '$dataset';
+                  var plugin_path = '$plugin_dir';
                   </script>";
     $script_path = $plugin_dir.'graph.js';
     $script = "<script src='$script_path'></script>";
 
-    return $graph . $div . $variables . $script;
+    return $graph . $three . $div . $variables . $script;
 }
 
 add_shortcode('knowledge-space', 'ks_add_graph');