From dcbef8efeda62cca825367839e93e352f918f687 Mon Sep 17 00:00:00 2001
From: Lorenz Padberg <lorenz.padberg@iterativ.ch>
Date: Mon, 4 Jul 2022 17:12:30 +0200
Subject: [PATCH] Fixed topics rendering

---
 .../components/circle/LearningPathDiagram.vue   | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/client/src/components/circle/LearningPathDiagram.vue b/client/src/components/circle/LearningPathDiagram.vue
index ea7b8651..2771af7c 100644
--- a/client/src/components/circle/LearningPathDiagram.vue
+++ b/client/src/components/circle/LearningPathDiagram.vue
@@ -69,10 +69,14 @@ export default {
           let pieGenerator = d3.pie()
           let pieData = pieGenerator(pieWeights)
           pieData.forEach((pie) => {
+            pie.startAngle = pie.startAngle + Math.PI
+            pie.endAngle = pie.endAngle + Math.PI
             const lp = circle.learningSequences[parseInt(pie.index)];
             pie.done = circle.someFinishedInLearningSequence(lp.translation_key);
           });
-          circle.pieData = pieData
+          circle.pieData = pieData.reverse()
+
+
         });
         return internalCircles
       }
@@ -97,6 +101,7 @@ export default {
       sky500 = '#41B5FA'
 
     let vueRouter = this.$router
+    console.log('this.learningpath', this.learningPathStore.learningPath)
 
     // Create append pie charts to the main svg
     const circle_groups = this.svg
@@ -113,7 +118,7 @@ export default {
         d3.select(this)
           .selectAll('.learningSegmentArc')
           .transition()
-          .duration('200')
+          .duration(200)
           .attr('fill', (d) => {
             return d.done ? sky400 : gray100
           })
@@ -122,7 +127,7 @@ export default {
         d3.select(this)
           .selectAll('.learningSegmentArc')
           .transition()
-          .duration('200')
+          .duration(200)
           .attr('fill', (d) => {
             return d.done ? sky500 : gray300
           })
@@ -143,7 +148,7 @@ export default {
     const arcs = this.svg
       .selectAll('g')
       .selectAll('.learningSegmentArc')
-      .data((d) => {
+      .data((d) => {console.log('DDDD', d)
         return d.pieData
       })
       .enter()
@@ -153,7 +158,7 @@ export default {
 
     arcs
       .transition()
-      .duration('1000')
+      .duration(1000)
       .attr('fill', (d) => {
         return d.done ? sky500 : gray300
       })
@@ -175,7 +180,7 @@ export default {
 
     const topicGroups = this.svg
       .selectAll('.topic')
-      .data(this.learningPathContents.topics)
+      .data(this.learningPathStore.learningPath.topics)
       .enter()
       .append('g')
       .attr('transform', (d, i) => {