Concaténation de données pour créer une variable data

**Bensljul** · 16/07/2019, 08h07

Bonjour,

je souhaite générer dynamiquement des graphiques en fonction de valeurs contenus dans un JSON, j'ai presque tout réussi mais il me manque une dernière brique..
pour faire simple, j'ai un JSON de cette forme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
{
"09-07-19":{
     "200":100,
      "502":10,
},
"10-07-19":{
     "200":1000,
    " 502":200
}
}

J'ai un array avec les dates ça pas de soucis et j'aimerais regrouper les données de chaque 'code apache' et créer un array de cette forme :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

[{label:200 , data: [100,1000]},{label:502,data:[10,200]}]

Cependant je bloque un peu ^^

Si quelqu'un peut m'éclairer je lui en serais très reconnaissant

Merci

**SpaceFrog** · 16/07/2019, 08h55

une boucle .each() sur chacun des element et sous elements du json ...

**Bensljul** · 16/07/2019, 08h59

Oui c'est ce que je fais, mais je n'arrive pas à rassembler chaque "200" par exemple,

en plus je viens de me rendre compte que j'ai pas sauvegardé mes essais d'hier XD

je met mon js en PJ

**Toufik83** · 16/07/2019, 13h48

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
let json = {
  "09-07-19": {
    "200": 100,
    "502": 10,
  },
  "10-07-19": {
    "200": 1000,
    "502": 200
  }
},
tab=[{label:'200',data:[]},{label:'502',data:[]}];
$.each(json,function(key,value){
    tab[0]['data'].push(value['200']);
    tab[1]['data'].push(value['502']);
});
console.log(tab);

**Bensljul** · 22/07/2019, 11h50

Re bonjour,

je n'y arrive toujours pas ^^ j'aiessayer ce code qui n'a pas fonctionné lol :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
$(document).ready(function(){
	//Fonction pour enlever les doublons
	function removeDuplicates(num) {
	  let x;
	  const len=num.length;
	  const out=[];
	  const obj={};
 
	  for (x=0; x<len; x++) {
		obj[num[x]]=0;
	  }
	  for (x in obj) {
		out.push(x);
	  }
	  return out;
	};
 
// TEST sur json simplifié
 
	$.getJSON('test.json',function(test,value){
		// console.log(test);
		var date_value=[],
				data_value=[],
				codeapache_value=[],
				tmp_code=[];
		$.each(test,function(date){
			date_value.push(date)
			$.each(test[date],function(codeapache,nombre){
					tmp_code.push(codeapache);
			});
		});
		codeapache_value=removeDuplicates(tmp_code);
		// console.log(codeapache_value);
		for (var elem in codeapache_value) {
				// console.log(codeapache_value[elem]);
					data_value.push('{label:'+codeapache_value[elem]+',data:[]}');
			};
 
		console.log(data_value[0]['label']);
 
 
		// $.each (test,function(date){
		// 	$.each(test[date],function(codeapache,value){
		// 		for (var elem2 in data_value){
		// 			data_value[elem2]['data'].push(value[codeapache]);
		// 		};
		// 	});
		// });
		// console.log(data_value);
	});	
	// Création du dataset
 
 
});

**Toufik83** · 22/07/2019, 19h07

Salut,

Le code que tu as écrit c'est du n'importe quoi

.

Le plus simple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
$(document).ready(function(){
 
	var result=[],ref=['200','502'];
 
	$.getJSON('test.json',function(test){
		$.map(ref,function(label){
			result.push({
				label:label,
				data:$.map(test,function(value){
					   return value[label];
					})
			});
		});
	});	
	console.log("result:",result);
 
});

Ou bien avec la syntaxe javascript d'aujourd'hui

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
$(document).ready(()=>{
 
	var result=[],ref=['200','502'];
 
	$.getJSON('test.json',test=>{
		$.map(ref,label=>{
			result.push({
				label:label,
				data:$.map(test,value=>{
					   return value[label];
					})
			});
		});
	});	
	console.log("result:",result);
 
});

**Bensljul** · 23/07/2019, 09h39

Super ca fonctionne !

super ce ^$.map

Merci beaucoup

**Bensljul** · 23/07/2019, 16h33

Eu juste une dernière question ces ligne c'est possible de les réaliser sur un json de ce type :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
{
  "date":{
      "RP1":{
             "ws1":{
                 "200":100,
                }
}

exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
{
	 "09-07-19":{
	 	 "agedepart.lassuranceretraite.fr":{
	 	 	  "agedepart-sapp-ng":{
 	 	 	 	 "200":11030,
 	 	 	 	 "302":11541,
 	 	 	 	 "403":6
	 	 	 	 },
	 	 	 "agedepart-sapp-ng_calcul":{
 	 	 	 	 "200":10823,
 	 	 	 	 "500":87
	 	 	 	 },
	 	 "authent.interops.cnav":{
	 	 	 "AIDA2":{
 	 	 	 	 "200":4159,
 	 	 	 	 "502":1
	 	 	 	 },
	 	 	 "AWSNCOLLEC":{
 	 	 	 	 "200":16127,
 	 	 	 	 "502":11
	 	 	 	 },
 
	 "10-07-19":{
	 	 "agedepart.lassuranceretraite.fr":{
	 	 	 "8598cd5c-059a-4a38-a5fb-b0f67b167a12":{
 	 	 	 	 "403":1
	 	 	 	 },
	 	 	 "":{
 	 	 	 	 "403":67
	 	 	 	 },
	 	 "authent.interops.cnav":{
	 	 	 "AIDA2":{
 	 	 	 	 "200":4220,
 	 	 	 	 "502":1
	 	 	 	 },
	 	 	 "AWSNCOLLEC":{
 	 	 	 	 "200":18103,
 	 	 	 	 "502":1
	 	 	 	 }
			}
	 	 }
	}
}

Parce que du coup j'essaye de l'adapter mais j'ai du mal

**Toufik83** · 23/07/2019, 16h38

non, le script que je t'ai posté n'est pas adapté à la structure de ton nouveau json (qui est mal formé en passant, ils manquent des fermetures "}" et une virgule), ~~et en plus les points dans agedepart.lassuranceretraite.fr et authent.interops.cnav... posent un problème, il faut remplacer les points par - ou _ ou ce que tu veux~~...

**NoSmoking** · 23/07/2019, 17h31

Bonjour,

Envoyé par Toufik83

et en plus les points dans agedepart.lassuranceretraite.fr et authent.interops.cnav... posent un problème, il faut remplacer les points par - ou _ ou ce que tu veux...

c'est une string.

Il me semble que ce travail devrait être réalisé côté serveur.

**Toufik83** · 23/07/2019, 17h49

Oui @NoSmoking, c'est juste et j'ai été trop vite dans ma réponse.

Sinon Bensljul pour la nouvelle structure de ton objet json (que tu dois corriger), tu peux essayer ce code :
Correction de la structure du fichier :

Code json :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
{
	"09-07-19":{
	 	"agedepart.lassuranceretraite.fr":{
	 	 	  "agedepart-sapp-ng":{
 	 	 	 	 "200":11030,
 	 	 	 	 "302":11541,
 	 	 	 	 "403":6
	 	 	 	 },
	 	 	    "agedepart-sapp-ng_calcul":{
					"200":10823,
					"500":87
				},
				"authent.interops.cnav":{
					 "AIDA2":{
						 "200":4159,
						 "502":1
						 },
					 "AWSNCOLLEC":{
						 "200":16127,
						 "502":11
						 }
				}
		}
	},
 
	"10-07-19":{
	 	 "agedepart.lassuranceretraite.fr":{
	 	 	 "8598cd5c-059a-4a38-a5fb-b0f67b167a12":{
 	 	 	 	 "403":1
	 	 	 	 },
	 	 	 "":{
 	 	 	 	 "403":67
	 	 	 	 },
	 	 "authent.interops.cnav":{
	 	 	 "AIDA2":{
 	 	 	 	 "200":4220,
 	 	 	 	 "502":1
	 	 	 	 },
	 	 	 "AWSNCOLLEC":{
 	 	 	 	 "200":18103,
 	 	 	 	 "502":1
	 	 	 	 }
			}
	 	 }
	}
}

Code jQuery :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
 
var result=[],ref=[200,302,403,500,502];
 
	$.getJSON('test.json',test=>{
		  $.map(ref,label=>{
			result.push({
				label:label,
				data:$.map(test,(v,item)=>{
					return $.map(v,v1=>{
						return $.map(v1,(v2,item2)=>{
							if(item2=="authent.interops.cnav"){
								return $.map(v2,v3=>{
									return v3[label];
								})
							}
							else return v2[label];
						});
					});
				})
			});
		  });
 
 
	})
	.fail(err=>{//au cas ou il y a une erreur, tu le sauras...
              console.log("Erreur $.getJSON :",err.responseText);
        });	
	console.log("result:",result);

**Bensljul** · 24/07/2019, 09h21

Oops j'avoue j'ai insérer un extrait de mon JSOn et j'ai pas vérifier si il n'y avait pas de coquilles ^^

Ah faut imbriquer les $.map, mince j'aurais du y penser lol c'était le fin de journée

Je vais essayer ceci aujourd'hui !

NB: je veux avoir les data des werbservices

exemple juste AIDA2

merci beaucoup

**Bensljul** · 24/07/2019, 14h11

J'ai essayé de rajouter ca pour avoir ceci quand je choisi AIDA2 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
[{
	label:'200'
	data :[ 4159,4220]
},
{
	label: '502',
	data: [1,1]
}]

dans le code ci dessous : la variable data_value correspond au result , et codeapache_value correspond a la variable ref du code précédent ^^ :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$.map(codeapache_value,labels=>{
				data_value.push({
					label:labels,
					data:$.map(rp_stats,(v,item)=>{
						return $.map(v,v1=>{
							return $.map(v1,v2=>{
								return $.map(v2,(v3,item3)=>{
									if (item3 == ws_value ){
										return $.map(v3,v4=>{
											return v4[labels];
										});
									}
									else return v3[labels];
								});
							});
						});
					})
				});
			});

et j'ai pas de messages d'erreur , juste un array data vide pour chaque codeapache ^^ j'ai du me planter , pourtant il me semblait avoir piger le roulement du $.map ^^'

**Toufik83** · 24/07/2019, 14h24

Il faut mettre ws_value entre guillemets ou double quotes, parce que c'est une chaîne de caractère.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if(item3=="ws_value"){...}

**Bensljul** · 24/07/2019, 14h48

J'ai fait la modification et j'ai cette erreur maintenant :

TypeError: right-hand side of 'in' should be an object, got numbe

**Toufik83** · 24/07/2019, 15h03

au faite, je viens de remarquer que ton code contient 5 map, alors que le miens ne contient que 4, pourquoi as-tu ajouter la 5iéme ?

**Bensljul** · 24/07/2019, 15h12

Euu parce qu'en fait quand j'ai 4 map; l'array data va choper tous les 200 et 500 de tous les webservices ^^ et du coup ca fait des énormes array lol

Et du coup j'ai regardé ce que tu m'avais donner pour essayer de faire en sorte qu'en fonction du (1) reverse-proxy choisit (ici "agedepart.lassuranceretraite.fr") puis du (2)webservices choisit (par exemple AIDA2),

Bin ca prend uniquement les 200 ou 500 correspondant à AIDA2 sur les 2 jours

Apparemment j'ai fait un fail XD