diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue index 74409c7f1..fd45dd750 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/App.vue +++ b/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) diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/store.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/store.js index c18323684..394fd55e6 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/store.js +++ b/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, diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/vis-network.js b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/vis-network.js index f1e9ab05e..eeddb7da4 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/VisGraph/vis-network.js +++ b/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