trying to debug the mis-scaling of proximity

src/components/ConcernementMapItem.vue

@@ -898,6 +898,9 @@ export default {
           let beta = 360 / entite.entite.proximite.length;
           let ray = 5;
           let e=0;
+          // define the right scaling down of the big original concernement contours
+          let scaledown = 0.05;
+
           entite.entite.proximite.forEach(entite_ref => {
             // console.log(`${entite_ref.id}, ${entite_ref.title}`, this.allEntitesById[entite_ref.id]);
 
@@ -911,14 +914,14 @@ export default {
             ref_instance.name = 'entite_ref';
 
             let entite_ref_pos = {
-              x: entite_pos.x + ray * Math.cos((beta*e) * (Math.PI/180)),
-              y: entite_pos.y + ray * Math.sin((beta*e) * (Math.PI/180)),
+              x: entite_pos.x + ray * Math.cos((beta*e) * (Math.PI/180)) * this.scale, // met a l'echelle la position du point de l'entite en proximite
+              y: entite_pos.y + ray * Math.sin((beta*e) * (Math.PI/180)) * this.scale, // met a l'echelle la position du point de l'entite en proximite
             }
             // console.log(`entite_ref_pos x:${entite_ref_pos.x}, y:${entite_ref_pos.y}`);
           
             ref_instance.position = new paper.Point(entite_ref_pos);
             // ref_instance.scale(this.scale);
-            ref_instance.scale(this.scale*0.75);
+            ref_instance.scale(this.scale*0.75); // met a l'échelle la taille du point et la diminue
             ref_instance.fillColor = '#000';
             ref_instance.item_id = entite_ref.id;
             ref_instance.item_type = 'entite_proximite_reference';
@@ -928,23 +931,21 @@ export default {
             ref_g.addChild(ref_instance)
 
             // create the original concernement contours arround the entite_ref
-            // define the right scale
-            let scale = 0.05;
-
+            
             let points = [];
             ref_concernement.sailentEntites.forEach(ent => {
               points.push({
-                x: (ent.display.ray) * Math.cos(ent.display.alpha * (Math.PI/180)),
-                y: (ent.display.ray) * Math.sin(ent.display.alpha * (Math.PI/180))
+                x: (ent.display.ray) * Math.cos(ent.display.alpha * (Math.PI/180)) * this.scale, // met a l'echelle la position du point par rapport a l'entite e proximite
+                y: (ent.display.ray) * Math.sin(ent.display.alpha * (Math.PI/180)) * this.scale // met a l'echelle la position du point par rapport a l'entite e proximite
               })
               
               // - - //
               // concat all the contours points for general contours arround all contours :/ :( (that's a very clear description)
               let p = {
-                x: entite_ref_pos.x - entite_pos.x + (ent.display.ray * Math.cos(ent.display.alpha * (Math.PI/180)))*scale,
-                y: entite_ref_pos.y - entite_pos.y + (ent.display.ray * Math.sin(ent.display.alpha * (Math.PI/180)))*scale
+                x: entite_ref_pos.x - entite_pos.x + (ent.display.ray * Math.cos(ent.display.alpha * (Math.PI/180))) * this.scale,
+                y: entite_ref_pos.y - entite_pos.y + (ent.display.ray * Math.sin(ent.display.alpha * (Math.PI/180))) * this.scale
               }
-              console.log(`p x:${p.x}, y:${p.y}`);
+              // console.log(`p x:${p.x}, y:${p.y}`);
                 
               allEntiteRefConcernementContourEntites.push({
                 display:{
@@ -956,15 +957,36 @@ export default {
             })
             
             // convert points to rouded and padded segments props
-            let segments = this.getPaddedRoundedSegments(points, scale)
+            let segments = this.getPaddedRoundedSegments(points, scaledown)
             // create "real" Paper Segments from previous segments props
             let paper_segments = [];
             segments.forEach(seg => {
+              let paddedSegPoint = {
+                x: entite_ref_pos.x+seg.point[0]*scaledown,
+                y: entite_ref_pos.y+seg.point[1]*scaledown
+              }
+              console.log('paddedSegPoint', paddedSegPoint);
               paper_segments.push(new paper.Segment({
-                point: [entite_ref_pos.x+seg.point[0]*scale, entite_ref_pos.y+seg.point[1]*scale],
+                point: paddedSegPoint,
                 handleIn: seg.handleIn,
                 handleout: seg.handleOut
               }))
+
+              // - - //
+              // concat all the contours points for general contours arround all contours :/ :( (that's a very clear description)
+              // let p = {
+              //   x: (entite_ref_pos.x - entite_pos.x + (ent.display.ray * Math.cos(ent.display.alpha * (Math.PI/180)))),
+              //   y: (entite_ref_pos.y - entite_pos.y + (ent.display.ray * Math.sin(ent.display.alpha * (Math.PI/180))))
+              // }
+              // console.log(`p x:${p.x}, y:${p.y}`);
+                
+              // allEntiteRefConcernementContourEntites.push({
+              //   display:{
+              //     ray: Math.sqrt(Math.pow(paddedSegPoint.x,2)+Math.pow(paddedSegPoint.y,2)),
+              //     alpha: parseFloat(Math.atan2(paddedSegPoint.y,paddedSegPoint.x) * (180/Math.PI)).toFixed(2)
+              //   }
+              // })
+              // - - //
             });
             // create the paper path with previous segments
             const contrs = new paper.Path({
@@ -983,22 +1005,6 @@ export default {
             e++;
           }); // end of loop on proximite for each main entite
           
-          // // debug
-          // allEntiteRefConcernementContourEntites.forEach(e => {
-          //   let p = paper.Path.Circle({
-          //     pivot: new paper.Point({x:0,y:0}),
-          //     center: [
-          //       entite_pos.x + (e.display.ray * Math.cos(e.display.alpha * (Math.PI/180))),
-          //       entite_pos.y + (e.display.ray * Math.sin(e.display.alpha * (Math.PI/180)))
-          //     ],
-          //     radius: 0.3,
-          //     fillColor: '#00F',
-          //     strokeColor: 'rgba(0,0,255,0.05)',
-          //     strokeWidth:2
-          //   })
-          //   ref_g.addChild(p);
-          // })
-          // // end debug
 
           // general contour arround proximité
           // console.log('allEntiteRefConcernementContourEntites', allEntiteRefConcernementContourEntites);
@@ -1012,14 +1018,16 @@ export default {
             })
           })
           console.log('points', points);
-          let scale = 0.8;
+
+          let gen_scaledown = 0.16;
+          // scaledown = 1;
           // convert points to rouded and padded segments props
-          let segments = this.getPaddedRoundedSegments(points, scale)
+          let segments = this.getPaddedRoundedSegments(points, gen_scaledown)
           // create "real" Paper Segments from previous segments props
           let paper_segments = [];
           segments.forEach(seg => {
             paper_segments.push(new paper.Segment({
-              point: [entite_pos.x+seg.point[0]*scale, entite_pos.y+seg.point[1]*scale],
+              point: [entite_pos.x+seg.point[0]*gen_scaledown, entite_pos.y+seg.point[1]*gen_scaledown],
               // point: [seg.point[0], seg.point[1]],
               handleIn: seg.handleIn,
               handleout: seg.handleOut