1 files changed, 43 insertions, 6 deletions
diff --git a/src/graph.js b/src/graph.js
index 640b42e..f7afe27 100644
--- a/src/graph.js
+++ b/src/graph.js
@@ -102,9 +102,50 @@ export default function buildGraph(db, handlers) {
     })
     .onNodeClick(handlers.click);
 
+  const initialZoom = () => {
+    const distance = 20000;
+    let angle = 0;
+    graph.cameraPosition(
+      {
+        x: distance * Math.sin(angle),
+        z: distance * Math.cos(angle),
+      },
+      { x: 0, y: 0, z: 0 },
+      0
+    );
+    setTimeout(() => zoomOut(1000));
+  };
+
+  const zoomOut = (duration = 1000) => {
+    const distance = 415;
+    let angle = 0;
+    graph.cameraPosition(
+      {
+        x: distance * Math.sin(angle),
+        z: distance * Math.cos(angle),
+      },
+      { x: 0, y: 0, z: 0 },
+      duration
+    );
+  };
+
+  const zoomIn = () => {
+    const distance = 200;
+    let angle = 0;
+    graph.cameraPosition(
+      {
+        x: distance * Math.sin(angle),
+        z: distance * Math.cos(angle),
+      },
+      { x: 0, y: 0, z: 0 },
+      1000
+    );
+  };
+
   const handleSelect = (category) => {
     if (!category) {
       graph.graphData(data);
+      zoomOut();
       return;
     }
     const { nodes, links } = data;
@@ -128,17 +169,13 @@ export default function buildGraph(db, handlers) {
     });
     console.log(selectedData);
     graph.graphData(selectedData);
+    zoomIn();
   };
 
   // graph.d3Force("charge").strength(-150);
 
   // camera orbit
-  const distance = 415;
-  let angle = 0;
-  graph.cameraPosition({
-    x: distance * Math.sin(angle),
-    z: distance * Math.cos(angle),
-  });
+  initialZoom();
 
   return {
     onSelect: handleSelect,