frontend-graph

dashboard/src/main/home/dashboard/expanded-chart/graph/Edge.tsx

@@ -48,13 +48,13 @@ const StyledEdge: any = styled.div.attrs((props: any) => ({
   style: {
     top: props.cy + 'px',
     left: props.cx + 'px',
-    },
+    transform: 'rotate(' + props.angle + 'deg)',
+    width: props.length + 'px'
+  },
 }))`
   position: absolute;
-  width: ${(props: any) => props.length + 'px'};
   height: ${thickness}px;
   background: #ffffff66;
   color: #ffffff22;
   z-index: 0;
-  transform: rotate(${(props: any) => props.angle}deg);
 `;

dashboard/src/main/home/dashboard/expanded-chart/graph/GraphDisplay.tsx

@@ -202,6 +202,7 @@ export default class GraphDisplay extends Component<PropsType, StateType> {
     return this.state.edges.map((edge: [number, number], i: number) => {
       return (
         <Edge
+          key={i}
           originX={this.state.originX}
           originY={this.state.originY}
           x1={this.state.nodes[edge[0]].x}