vue_visgraph improve (physics, corrections)

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue

@@ -96,6 +96,7 @@ export default {
       },
       toggleLayer(value) {
          //console.log('toggleLayer')
+         this.forceUpdateComponent()
          let id = value.target.value
          if (this.checkedLayers.includes(id)) {
             this.removeLayer(id)

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/store.js

@@ -223,7 +223,7 @@ const store = createStore({
                     from: `${p.person.type}_${p.person.id}`,
                     to: `${course.id}`,
                     id: `p${p.person.id}-c`+ course.id.split('_')[2],
-                    arrows: 'to',
+                    arrows: 'from',
                     color: 'orange',
                     font: { color: 'darkorange' },
                     label: visMessages.fr.visgraph.concerned,

src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/vis-network.js

@@ -20,6 +20,55 @@ window.options = {
         showButton: true
     },
     */
+    physics:{
+        enabled: true,
+        barnesHut: {
+            theta: 0.5,
+            gravitationalConstant: -2000,
+            centralGravity: 0.1, //// 0.3
+            springLength: 200, //// 95
+            springConstant: 0.04,
+            damping: 0.09,
+            avoidOverlap: 0
+        },
+        forceAtlas2Based: {
+            theta: 0.5,
+            gravitationalConstant: -50,
+            centralGravity: 0.01,
+            springConstant: 0.08,
+            springLength: 100,
+            damping: 0.4,
+            avoidOverlap: 0
+        },
+        repulsion: {
+            centralGravity: 0.2,
+            springLength: 200,
+            springConstant: 0.05,
+            nodeDistance: 100,
+            damping: 0.09
+        },
+        hierarchicalRepulsion: {
+            centralGravity: 0.0,
+            springLength: 100,
+            springConstant: 0.01,
+            nodeDistance: 120,
+            damping: 0.09,
+            avoidOverlap: 0
+        },
+        maxVelocity: 50,
+        minVelocity: 0.1,
+        solver: 'barnesHut',
+        stabilization: {
+            enabled: true,
+            iterations: 1000,
+            updateInterval: 100,
+            onlyDynamicEdges: false,
+            fit: true
+        },
+        timestep: 0.5,
+        adaptiveTimestep: true,
+        wind: { x: 0, y: 0 }
+    },
     manipulation: {
         enabled: true,
         initiallyActive: true,
@@ -66,12 +115,12 @@ window.options = {
         }
     },
     nodes: {
-        physics: true,
+        //physics: true,
         borderWidth: 1,
         borderWidthSelected: 3,
     },
     edges: {
-        physics: true,
+        //physics: true,
         font: {
             color: '#b0b0b0',
             size: 9,
@@ -130,7 +179,7 @@ const adapt2vis = (entity) => {
     switch (entity.type) {
         case 'person':
             entity._id = entity.id
-            entity.label = entity.text
+            entity.label = `${entity.text}\n` + getGender(entity.gender_numeric) +' - '+ getAge(entity.birthdate)
             entity.id = `person_${entity.id}`
             break
         case 'household':
@@ -146,13 +195,31 @@ const adapt2vis = (entity) => {
         case 'relationship':
             entity._id = entity.id
             entity.id = `relationship_${entity.id}`
-
-            // sera utilisé pour les links :
-            //entity.id = 'r' + entity._id + '_p' + entity.fromPerson.id + '_p' + entity.toPerson.id
     }
     return entity
 }
 
+const getGender = (gender) => {
+    switch (gender) {
+        case 0:
+            return 'N'
+        case 1:
+            return 'M'
+        case 2:
+            return 'F'
+        default:
+            throw 'gender undefined'
+    }
+}
+const getAge = (birthdate) => {
+    if (null === birthdate) {
+        return null
+    }
+    const birthday = new Date(birthdate.datetime)
+    const now = new Date()
+    return (now.getFullYear() - birthday.getFullYear()) + ' ans'
+}
+
 /**
  * Return member position in household
  * @param member