diff options
author | Julia McCauley <skurvyj@gmail.com> | 2021-04-16 19:46:45 -0400 |
---|---|---|
committer | Julia McCauley <skurvyj@gmail.com> | 2021-04-16 19:46:45 -0400 |
commit | fa4feff17c9e15b86388fd5ee1ac6771ff4d5148 (patch) | |
tree | 72157df02027b860e74097050349d49ebecebc0a /maps-frontend/src/components/Visualization.js | |
parent | eab479adc987ab20424a542275a697e0c8dbce61 (diff) | |
parent | a7f1433da5ddf11845251a062da96bc42c631f50 (diff) |
need to pull new frontend Merge branch 'master' of github.com:cs0320-2021/term-project-cohwille-jmccaul3-mfoiani-rhunt2
Diffstat (limited to 'maps-frontend/src/components/Visualization.js')
-rw-r--r-- | maps-frontend/src/components/Visualization.js | 69 |
1 files changed, 0 insertions, 69 deletions
diff --git a/maps-frontend/src/components/Visualization.js b/maps-frontend/src/components/Visualization.js deleted file mode 100644 index c0e5811..0000000 --- a/maps-frontend/src/components/Visualization.js +++ /dev/null @@ -1,69 +0,0 @@ -// JS module imports -import { useEffect, useRef, useState } from "react"; -import uuid from 'react-uuid'; -import Graph from 'vis-react'; - -// CSS imports -import '../css/Canvas.css'; - -/** - * This function renders and mantains thhe canvas. - * @param {Object} props The props for the canvas. - * @returns {import("react").HtmlHTMLAttributes} The canvas to be retured. - */ -function Visualization(props) { - const options = { - edges: { - color: "#ffffff" - }, - autoResize: true - }; - const events = { - select: () => event => props.setSelected(event.nodes[0]) - }; - - const [graphState, setGraphState] = useState({ - nodes: [], - edges: [] - }); - const getNodes = () => { - let nodes = []; - props.data.forEach(hub => { - nodes.push({ - id: hub.id, - label: hub.name, - size: hub.suspicionScore * 10 - }); - }); - return nodes; - } - const getEdges = () => { - let edges = [] - props.data.forEach(hub => { - hub.followers.forEach(follower => { - edges.push({ - from: hub.id, - to: follower.id - }); - }); - }); - return edges; - } - - // Hooks to update graph state - useEffect(() => setGraphState({nodes: getNodes(), edges: getEdges()}), [props.data]); - - return ( - <div className="Map-canvas"> - <Graph - key={uuid()} - graph={graphState} - options={options} - events={events}> - </Graph> - </div> - ); -} - -export default Visualization; - |