started to build paper dynamic objects in doleancer

src/components/ConcernementMapItem.vue

@@ -1223,7 +1223,7 @@ export default {
           'comment_ennonce_doleance',
           'aqui_addresse_doleance',
           {
-            fieldname: 'groupesinterets',
+            fieldname: 'reception_traitement',
             fields: [
                     'entite_adressee',
                     'doleance_formulee',
@@ -1336,7 +1336,78 @@ export default {
         justification: 'center'
       }));
       g.addChild(enquete);
-          
+      
+      //
+      // MULTIPLE FIELDS
+      //
+      let multiple_fields = [
+        {
+          field_name: 'groupesinterets',
+          arc: 45,
+          decalage: -45
+        },
+        {
+          field_name: 'reception_traitement',
+          arc: 90,
+          decalage: -90
+        },
+        {
+          field_name: 'mise_en_oeuvre_decision',
+          arc: 90,
+          decalage: -180
+        },
+        {
+          field_name: 'receptions_et_applications',
+          arc: 45,
+          decalage: 90 
+        }
+      ]
+
+      multiple_fields.forEach((mf, j) => {
+        for (let i = 0, l = doleance[mf.field_name].length, a = mf.arc/l; i < l; i++) {
+          let gi = new paper.Group({
+            item_type: mf.field_name,
+            item_index: i
+          });
+          //camenbert
+          let x1=  this.pos.x + Math.sin((mf.decalage- a*i)*(Math.PI/180)) * dr,
+              y1=  this.pos.y + Math.cos((mf.decalage- a*i)*(Math.PI/180)) * dr;
+          let x2=  this.pos.x + Math.sin((mf.decalage- a*i)*(Math.PI/180)) * r,
+              y2=  this.pos.y + Math.cos((mf.decalage- a*i)*(Math.PI/180)) * r;
+          let x3=  this.pos.x + Math.sin((mf.decalage- a*(i+1))*(Math.PI/180)) * r,
+              y3=  this.pos.y + Math.cos((mf.decalage- a*(i+1))*(Math.PI/180)) * r;
+          let x3t= this.pos.x + Math.sin((mf.decalage- a*(i+0.5))*(Math.PI/180)) * r,
+              y3t= this.pos.y + Math.cos((mf.decalage- a*(i+0.5))*(Math.PI/180)) * r;
+          let x4=  this.pos.x + Math.sin((mf.decalage- a*(i+1))*(Math.PI/180)) * dr,
+              y4=  this.pos.y + Math.cos((mf.decalage- a*(i+1))*(Math.PI/180)) * dr;
+          let x4t= this.pos.x + Math.sin((mf.decalage- a*(i+0.5))*(Math.PI/180)) * dr,
+              y4t= this.pos.y + Math.cos((mf.decalage- a*(i+0.5))*(Math.PI/180)) * dr;
+          let x5=  this.pos.x + Math.sin((mf.decalage- a*(i+0.5))*(Math.PI/180)) * r*0.75,
+              y5=  this.pos.y + Math.cos((mf.decalage- a*(i+0.5))*(Math.PI/180)) * r*0.75;
+          let p = new paper.Path({
+            strokeColor: '#fff',
+            strokeWidth: 2,
+            fillColor: "rgba(255, 255, 255, 0.4)"
+          });
+          p.add([x1,y1]);
+          p.lineTo([x2,y2]);
+          p.arcTo([x3t,y3t], [x3,y3]);
+          p.lineTo([x4,y4]);
+          p.arcTo([x4t,y4t], [x1,y1]);
+          gi.addChild(p);
+          // text
+          gi.addChild(new paper.PointText({
+            point: {x:x5,y:y5},
+            content: `${j}-${i}`,
+            fontSize: fontsize,
+            fillColor: '#fff',
+            justification: 'center'
+          }))
+
+          g.addChild(gi)
+        }
+      });
+
       return g;
     },
     // PAPER EVENTS