aboutsummaryrefslogtreecommitdiff
path: root/react-frontend/src/components/Visualization.js
diff options
context:
space:
mode:
Diffstat (limited to 'react-frontend/src/components/Visualization.js')
-rw-r--r--react-frontend/src/components/Visualization.js47
1 files changed, 45 insertions, 2 deletions
diff --git a/react-frontend/src/components/Visualization.js b/react-frontend/src/components/Visualization.js
index 9a837a1..33f96c9 100644
--- a/react-frontend/src/components/Visualization.js
+++ b/react-frontend/src/components/Visualization.js
@@ -5,14 +5,27 @@ import Graph from 'vis-react';
// CSS imports
import '../css/Canvas.css';
+import EdgeInfo from "./EdgeInfo";
/**
- * This function renders and mantains thhe canvas.
+ * This function renders and mantains the canvas.
* @param {Object} props The props for the canvas.
* @returns {import("react").HtmlHTMLAttributes} The canvas to be retured.
*/
function Visualization(props) {
+
+ /*let stocks = {};
+ let hideEdgeInfo = true;
+
+ const setStocks = (newStocks) => {
+ stocks = newStocks;
+ }
+
+ const setHideEdgeInfo = (val) => {
+ hideEdgeInfo = val;
+ }*/
+
const options = {
edges: {
color: "#ffffff"
@@ -26,6 +39,27 @@ function Visualization(props) {
nodes: [],
edges: []
});
+
+ /*const getEdgeInfo = (fromID, toID) => {
+ fetch("http://localhost:4567/edge-data", {
+ method: "POST",
+ body: JSON.stringify({
+ followerID: fromID,
+ leaderID: toID,
+ }),
+ headers: {
+ "Content-Type": "application/json",
+ },
+ credentials: "same-origin"
+ })
+ .then(res => res.json())
+ .then(data => {
+ console.log(data);
+ setStocks(data);
+ setHideEdgeInfo(false);
+ })
+ .catch(err => console.log(err));
+ }*/
const getNodes = () => {
let nodes = [];
const maxScore = props.data[0].suspicionScore;
@@ -79,12 +113,21 @@ function Visualization(props) {
color:{
opacity: 0.7,
highlight:'#fdca40',
- }
+ },
+ /*chosen: {
+ edge: () => getEdgeInfo(follower.id, hub.id)
+ }*/
});
});
});
return edges;
}
+ /*
+ * <EdgeInfo
+ stockList={stocks}
+ setHideInfo={setHideEdgeInfo}
+ hidden={hideEdgeInfo}>
+ </EdgeInfo>*/
// Hooks to update graph state
useEffect(() => setGraphState({nodes: getNodes(), edges: getEdges()}), [JSON.stringify(props.data)]);