rendering circles

Author: Brianna Sookhoo

app/charts/route-trace.jsx

@@ -1,6 +1,4 @@
-import React, { useContext } from 'react';
 import * as d3 from 'd3';
-
 class RouteTrace {
 
   containerEl;
@@ -26,8 +24,8 @@ class RouteTrace {
       .enter()
       .append('circle')
       .style('fill', 'red')
-      .attr('cx', () => Math.random() * width)
-      .attr('cy', () => Math.random() * height)
+      .attr('cx', 20)
+      .attr('cy', 200)
       .attr('r', 20)
       .on('mouseup', (d, i, nodes) => this.setActiveDatapoint(d, nodes[i]));
   }

app/containers/GraphsContainer.jsx

@@ -10,7 +10,6 @@ import RouteTrace from '../charts/route-trace.jsx';
 import MicroServiceTraffic from '../charts/microservice-traffic.jsx';
 import '../stylesheets/graphs.css';
 
-
 let vis;
 
 const GraphsContainer = (props) => {
@@ -39,15 +38,13 @@ const GraphsContainer = (props) => {
   const [active, setActive] = useState(null);
   const canvas = useRef(null);
 
-
   useEffect(fetchData, []);
   useEffect(initVis, [ data ]);
 
   function fetchData() {
     Promise.resolve().then(() => setData(initialData.nodes));
   }
 
-
   function initVis() {
     if(data && data.length) {
       const d3Props = {