diff --git a/components/Graph.js b/components/Graph.js
index 6174d97..277ac59 100644
--- a/components/Graph.js
+++ b/components/Graph.js
@@ -84,7 +84,7 @@ function Graph({graph}) {
     return (
         <>
             <div>
-                <h1>Cytoscape example</h1>
+                <h3>Links to this notes</h3>
                 <div
                     style={{
                         border: "1px solid",
diff --git a/lib/utils.js b/lib/utils.js
index 08786dc..6544541 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -109,16 +109,17 @@ export function constructBackLinks() {
 }
 
 
-export function getGraphData() {
+export function getGraphData(currentNodeId) {
 
     const {nodes, edges} = constructBackLinks()
 
     const newNodes = nodes.map(aNode => (
-        {data : {
-            id: aNode.slug.toString(),
+        {
+            data: {
+                id: aNode.slug.toString(),
                 label: aNode.slug.toString(),
                 type: "ip"
-        }
+            }
         }
     ))
 
@@ -130,14 +131,35 @@ export function getGraphData() {
         }
     }))
 
-    // Remove edges that don't have any connections
-    const existingNodeID = newNodes.map(aNode => aNode.data.id)
-    const filteredEdges = newEdges.filter(edge => existingNodeID.includes(edge.data.source)).filter(edge => existingNodeID.includes(edge.data.target))
 
-    return {
-        nodes: newNodes,
-        edges: filteredEdges
+
+    const existingNodeIDs = newNodes.map(aNode => aNode.data.id)
+    if (currentNodeId != null && existingNodeIDs.includes(currentNodeId)) {
+        const localNodeIDs = newEdges
+            .filter(anEdge => anEdge.data.source === currentNodeId)
+            .map(anEdge => anEdge.data.target)
+
+        localNodeIDs.push(currentNodeId)
+
+        const localNodes = newNodes.filter(aNode => localNodeIDs.includes(aNode.data.id))
+        const localEdges = newEdges.filter(edge => localNodeIDs.includes(edge.data.source)).filter(edge => localNodeIDs.includes(edge.data.target))
+
+        return {
+            nodes: localNodes,
+            edges: localEdges
+        }
+    } else {
+        const filteredEdges = newEdges
+            .filter(edge => existingNodeIDs.includes(edge.data.source))
+            .filter(edge => existingNodeIDs.includes(edge.data.target))
+
+        return {
+            nodes: newNodes,
+            edges: filteredEdges
+        }
     }
+
+
 }
 
 export function getContentPaths() {
diff --git a/pages/index.js b/pages/index.js
index a014c66..60af6db 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -19,9 +19,10 @@ export default function Home({graphData, content, tree, flattenNodes}) {
                     <FolderTree tree={tree} flattenNodes={flattenNodes}/>
                 </nav>
                 <MDContainer post={content.data}/>
+                <DynamicGraph graph={graphData}/>
             </div>
-            <hr/>
-            <DynamicGraph graph={graphData}/>
+
+
         </Layout>
     );
 
@@ -31,7 +32,7 @@ export function getStaticProps() {
     const tree = convertObject(getDirectoryData());
     const contentData = getSinglePost("index");
     const flattenNodes = getFlattenArray(tree)
-    const graphData = getGraphData();
+    const graphData = getGraphData("index");
     return {
         props: {
             content: contentData,
diff --git a/pages/note/[id].js b/pages/note/[id].js
index eb30051..7c26f6b 100644
--- a/pages/note/[id].js
+++ b/pages/note/[id].js
@@ -5,13 +5,22 @@ import {
     getSinglePost,
     convertObject,
     getDirectoryData,
-    constructBackLinks, getFileNames
+    constructBackLinks, getFileNames, getGraphData
 } from "../../lib/utils";
 import FolderTree from "../../components/FolderTree";
 import {getFlattenArray} from "../../lib/utils";
 import MDContent from "../../components/MDContent";
 
-export default function Home({note, backLinks, fileNames, tree, flattenNodes}) {
+import dynamic from 'next/dynamic'
+
+
+
+const DynamicGraph = dynamic(
+    () => import('../../components/Graph'),
+    { loading: () => <p>Loading ...</p>, ssr: false }
+)
+
+export default function Home({note, backLinks, fileNames, tree, flattenNodes, graphData}) {
     return (
         <Layout>
             <Head>
@@ -22,7 +31,9 @@ export default function Home({note, backLinks, fileNames, tree, flattenNodes}) {
                     <FolderTree tree={tree} flattenNodes={flattenNodes}/>
                 </nav>
                 <MDContent content={note.data} fileNames={fileNames} handleOpenNewContent={null} backLinks={backLinks}/>
+                <DynamicGraph graph={graphData}/>
             </div>
+
         </Layout>
     );
 }
@@ -30,6 +41,7 @@ export default function Home({note, backLinks, fileNames, tree, flattenNodes}) {
 export async function getStaticPaths() {
     const allPostsData = getContentPaths();
     const paths = allPostsData.map(p => ({params: {id: p}}))
+
     return {
         paths,
         fallback: false
@@ -48,13 +60,15 @@ export function getStaticProps({params}) {
     const listOfEdges =   edges.filter(anEdge => anEdge.target === params.id)
     const internalLinks = listOfEdges.map(anEdge => nodes.find(aNode => aNode.slug === anEdge.source)).filter(element => element !== undefined)
 
+    const graphData = getGraphData(params.id)
     return {
         props: {
             note,
             tree: tree,
             flattenNodes: flattenNodes,
             fileNames: fileNames,
-            backLinks: internalLinks
+            backLinks: internalLinks,
+            graphData: graphData
         },
     };
 }