#2140 implemented rounding concernement contour form

src/components/ConcernementMapItem.vue

@@ -627,37 +627,44 @@ export default {
 
     },
     setPaperContour(){
-      let getExentricPoint = (b,a,c) => {
+      let getPaddedRoundedSegments = (b,a,c) => {
-        // get ac vecteur
+        const ac  = { x: c.x - a.x, y: c.y - a.y } // get ac vecteur
-        const ac  = { x: c.x - a.x, y: c.y - a.y }
+        const lac = Math.sqrt(Math.pow(ac.x, 2) + Math.pow(ac.y, 2)); // get ac longueur ac
-        // get ac longueur ac
+        const ab  = { x: b.x - a.x, y: b.y - a.y } // get ab vecteur
-        const lac = Math.sqrt(Math.pow(ac.x, 2) + Math.pow(ac.y, 2));
+        const lab = Math.sqrt(Math.pow(ab.x, 2) + Math.pow(ab.y, 2)); // get ab longeur
-        // get ab vecteur
+        const vab = { x: ab.x/lab, y: ab.y/lab } // get unit vecteur ab
-        const ab  = { x: b.x - a.x, y: b.y - a.y }
+        const an  = { x: vab.x*lac, y: vab.y*lac } // get an vecteur
-        // get ab longeur
+        const n   = { x: a.x + an.x, y: a.y+an.y } // get n point
-        const lab = Math.sqrt(Math.pow(ab.x, 2) + Math.pow(ab.y, 2));
+        const m   = { x: (c.x + n.x)/2, y: (c.y + n.y)/2 } // get nc midle point
-        // get unit vecteur ab
+        const ma  = { x:a.x - m.x, y: a.y - m.y } // get ma vecteur
-        const vab = { x: ab.x/lab, y: ab.y/lab }
+        const lma = Math.sqrt(Math.pow(ma.x, 2)+Math.pow(ma.y, 2)) // get longeur m->a
-        // get an vecteur
+        const vma = { x: ma.x/lma, y: ma.y / lma } // get ma vecteur unitaire
-        const an  = { x: vab.x*lac, y: vab.y*lac }
+        const pad = 4; // exterior padding
-        // get n point
+        // the final padded point
-        const n   = { x: a.x + an.x, y: a.y+an.y }
+        const pa  = [
-        // get nc midle point
-        const m   = { x: (c.x + n.x)/2, y: (c.y + n.y)/2 }
-        // get ma vecteur
-        const ma  = { x:a.x - m.x, y: a.y - m.y }
-        // get longeur m->a
-        const lma = Math.sqrt(Math.pow(ma.x, 2)+Math.pow(ma.y, 2))
-        // get ma vecteur unitaire
-        const vma = { x: ma.x/lma, y: ma.y / lma }
-        const pad = 4;
-        return [
           this.pos.x+(a.x+vma.x*pad)*this.scale,
           this.pos.y+(a.y+vma.y*pad)*this.scale
         ]
+        
+        // handles
+        const delta = 0.25;
+        // handle IN
+        const hli   = Math.abs(lab)*delta;            // handle longeur
+        const vnai  = { x: -vma.y, y: vma.x }     // get the ma normal unit vector IN
+        const hai   = [ vnai.x*hli, vnai.y*hli ]; // get the handleIn point
+        // handle OUT
+        const hlo   = Math.abs(lac)*delta;            // handle longeur
+        const vnao  = { x: vma.y, y: -vma.x }     // get the ma normal vector Out
+        const hao   = [ vnao.x*hlo, vnao.y*hlo ]; // get the handleOut point
 
+
+        return new paper.Segment({
+          point: pa,
+          handleIn: hai,
+          handleOut: hao
+        })
       }
-      const first_point = getExentricPoint(
+      const first_point = getPaddedRoundedSegments(
         this.salientPoints[this.salientPoints.length-1].pos,
         this.salientPoints[0].pos,
         this.salientPoints[1].pos
@@ -665,13 +672,13 @@ export default {
       let segments = [first_point]; 
       for (let j = 1; j < this.salientPoints.length-1; j++) {
         // segments.push([this.pos.x+this.salientPoints[j].pos.x*this.scale*gap, this.pos.y+this.salientPoints[j].pos.y*this.scale*gap])
-          segments.push(getExentricPoint(
+          segments.push(getPaddedRoundedSegments(
             this.salientPoints[j-1].pos,
             this.salientPoints[j].pos,
             this.salientPoints[j+1].pos,
           ))
       }
-      const last_point = getExentricPoint(
+      const last_point = getPaddedRoundedSegments(
         this.salientPoints[this.salientPoints.length-2].pos,
         this.salientPoints[this.salientPoints.length-1].pos,
         this.salientPoints[0].pos
@@ -679,15 +686,23 @@ export default {
       segments.push(last_point)
       segments.push(first_point)
       
-      return new paper.Path({
+
+
+      const contrs = new paper.Path({
         name: 'contours',
         segments: segments,
         fillColor: 'rgba(255,255,255,0.8)',
+        // selected: true,
         // strokeColor: '#000',
         // strokeWidth: 1,
         pivot: new paper.Point(this.pos),
         cid: this.id
       });
+
+      // contrs.segments[0].selected = true;
+      // contrs.segments[1].selected = true;
+
+      return contrs;
     },
     setPaperEntites(){
       let g = new paper.Group({