V1 affichage sociogramme, peu ergonomique, réfléchir a un système de positionnement relatif

This commit is contained in:
xdrm-brackets 2016-04-15 13:00:23 +02:00
parent 42e6fc9705
commit d2ad9576a6
2 changed files with 58 additions and 52 deletions

View File

@ -47,7 +47,6 @@
array( 4342, "Latasha", 21 ), array( 4342, "Latasha", 21 ),
array( 2957, "Coleen", 1 ), array( 2957, "Coleen", 1 ),
array( 2493, "Contreras", 100 ), array( 2493, "Contreras", 100 ),
array( 1895, "Roxanne", 27 ),
array( 4776, "Holmes", 97 ), array( 4776, "Holmes", 97 ),
array( 3623, "Hallie", 88 ), array( 3623, "Hallie", 88 ),
array( 3660, "Ginger", 26 ), array( 3660, "Ginger", 26 ),

View File

@ -3,69 +3,76 @@
/* (0) On recupere les elements importants */ /* (0) On recupere les elements importants */
var SOCIOGRAM = { var SOCIOGRAM = {
container: document.getElementById('sociogram'), container: document.getElementById('sociogram'),
sigma: null sigma: null,
request: { path: 'charts/network_data' },
response: null,
nodes: null,
edges: null
}; };
// Initialisation de SIGMA // Initialisation de SIGMA
SOCIOGRAM.sigma = new sigma(SOCIOGRAM.container); SOCIOGRAM.sigma = new sigma(SOCIOGRAM.container);
/* (1) On recupere les informations via l'API */ /* (1) On recupere les informations via l'API */
api.send(SOCIOGRAM.request, function(response){
// Si erreur, on quitte
if( response.ModuleError != 0 ) return;
// Sinon on enregistre
SOCIOGRAM.response = response;
/* (2) Parametrage de SIGMA */ /* (2) Parametrage de SIGMA */
SOCIOGRAM.sigma.settings({ SOCIOGRAM.sigma.settings({
defaultNodeColor: '#ec5148' defaultNodeColor: '#ec5148'
}); });
/* (3) On recupere la liste des noeuds */
var nodes = [ /* (3) On recupere la liste des noeuds */
{ SOCIOGRAM.nodes = [];
"id": "n0",
"label": "A node", // On calcule l'angle min
"x": 0, var ang = 2*Math.PI / SOCIOGRAM.response.data.alter.length;
"y": 0,
"size": 3 // Pour chaque alter
}, { for( var i = 0 ; i < SOCIOGRAM.response.data.alter.length ; i++ ){
"id": "n1", SOCIOGRAM.nodes.push({
"label": "Another node", 'id': 'n-'+SOCIOGRAM.response.data.alter[i][0],
"x": 3, 'label': SOCIOGRAM.response.data.alter[i][1],
"y": 1, 'x': 500+ 100*Math.cos(ang*i),
"size": 2 'y': 500+ 100*Math.sin(ang*i),
}, { 'size': SOCIOGRAM.response.data.alter[i][2]/10
"id": "n2", });
"label": "And a last one", }
"x": 1,
"y": 3,
"size": 1
}];
/* (4) On recupere la liste des liens */
var edges = [{ /* (4) On recupere la liste des liens */
"id": "e0", SOCIOGRAM.edges = [];
"source": "n0",
"target": "n1" for( var i = 0 ; i < SOCIOGRAM.response.data.inter.length ; i++ ){
}, { SOCIOGRAM.edges.push({
"id": "e1", 'id': 'e-'+SOCIOGRAM.response.data.inter[i][0]+'-'+SOCIOGRAM.response.data.inter[i][1],
"source": "n1", 'source': 'n-'+SOCIOGRAM.response.data.inter[i][0],
"target": "n2" 'target': 'n-'+SOCIOGRAM.response.data.inter[i][1]
}, { });
"id": "e2", }
"source": "n2",
"target": "n0"
}];
/* (5) On ajoute nos noeuds */
for( var i = 0 ; i < nodes.length ; i++)
SOCIOGRAM.sigma.graph.addNode(nodes[i]);
/* (6) On ajoute nos liens */ /* (5) On ajoute nos noeuds */
for( var i = 0 ; i < edges.length ; i++) for( var i = 0 ; i < SOCIOGRAM.nodes.length ; i++)
SOCIOGRAM.sigma.graph.addEdge(edges[i]); SOCIOGRAM.sigma.graph.addNode(SOCIOGRAM.nodes[i]);
/* (7) Gestion des interactions */ /* (6) On ajoute nos liens */
for( var i = 0 ; i < SOCIOGRAM.edges.length ; i++)
SOCIOGRAM.sigma.graph.addEdge(SOCIOGRAM.edges[i]);
/* (7) Gestion des interactions */
/* (8) On affiche le graphique */ /* (8) On affiche le graphique */
SOCIOGRAM.sigma.camera.ratio = 2; SOCIOGRAM.sigma.camera.ratio = 2;
SOCIOGRAM.sigma.refresh(); SOCIOGRAM.sigma.refresh();
});