From 87ab5ae194c112e51eea2d52656d2ab8d9800153 Mon Sep 17 00:00:00 2001
From: Lorenz Padberg <lorenz.padberg@iterativ.ch>
Date: Tue, 4 Oct 2022 11:18:11 +0200
Subject: [PATCH] Fix Bug of multiple circles over each other.

---
 client/src/components/learningPath/CircleDiagram.vue | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/client/src/components/learningPath/CircleDiagram.vue b/client/src/components/learningPath/CircleDiagram.vue
index 947ce6c3..1caa2321 100644
--- a/client/src/components/learningPath/CircleDiagram.vue
+++ b/client/src/components/learningPath/CircleDiagram.vue
@@ -68,12 +68,13 @@ const radius = Math.min(width, height) / 2.4;
 function render() {
   const arrowStrokeWidth = 2;
 
-  const svg = d3
-    .select(".circle-visualization")
-    .attr("viewBox", `0 0 ${width} ${height}`);
-
-  // Append markter as definition to the svg
+  const svg = d3.select(".circle-visualization");
+  // Clean svg before adding new stuff.
+  svg.selectAll("*").remove();
+  
+  // Append marker as definition to the svg
   svg
+    .attr("viewBox", `0 0 ${width} ${height}`)
     .append("svg:defs")
     .append("svg:marker")
     .attr("id", "triangle")