Discussion :

[Zebulon777]

Bonjour tout le monde.

Je ne suis pas certain que le titre soit très bien adapté.

Toujours dans mon problème de dataView, mais cette fois-çi, j'essaye de gérer le contentToOption en récupérant des informations qui ont été créées dans le optionToContent, mais je ne comprends pas car ça reste "undefined".

C'est la fin de la journée, donc je dois surement passer à côté d'un truc tout bête, mais là, je ne vois pas ce qui va sans doute vous sauter aux yeux

WLigTab reste désespérément à "undefined".

Code javascript :

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
56
57
58
59
 
dataView: {
	show: true, // Affiche ou non l'icône pour afficher les données utilisées.
	readOnly: false,
	backgroundColor: '#88ABD9',
	title: 'Données',
	lang: ['Données utilisées pour le graphique...', 'Retour', 'Export CSV'], 
	optionToContent: function(opt) {
		if (P_Plateforme == "LFPO")
			{
				$('#Info_lfpo_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		if (P_Plateforme == "LFPG")
			{
				$('#Info_lfpg_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		if (P_Plateforme == "LFPB")
			{
				$('#Info_lfpb_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		var axisData = opt.xAxis[0].data;
		var series = opt.series;
		var WTable01 = '<div id="ID_Table_Data">';
		WTable01 = WTable01 + '<table class="table-fill">';
		WTable01 = WTable01 + '<thead><tr>';
		WTable01 = WTable01 + '<th class="text-center" style="width:120px">Tranches Horaires</th>'
		WTable01 = WTable01 + '<th class="text-center" style="width:120px">Intervales</th>'
		WTable01 = WTable01 + '<th class="text-center">' + series[1].name + '</th>';
		WTable01 = WTable01 + '<th class="text-center">' + series[2].name + '</th>';
		WTable01 = WTable01 + '<th class="text-center">' + series[0].name + '</th>';
		WTable01 = WTable01 + '</tr></thead>';
		WTable01 = WTable01 + '<tbody class="table-hover">';
		for (var i = 0, l = axisData.length; i < l; i++) {
			WTable01 += '<tr>'
					 + '<td class="text-center">' + TranchesHoraires_X[i] + '</td>'
					 + '<td class="text-center">' + Interv[parseInt(i)] + '</td>'
					 + '<td class="text-center">' + series[1].data[i] + '</td>'
					 + '<td class="text-center">' + series[2].data[i] + '</td>'
					 + '<td class="text-center">' + series[0].data[i] + '</td>'
					 + '</tr>';
		}
		WTable01 += '</div></tbody></table>';
		return WTable01;
	},
	contentToOption: function(opt){ // Va permetrtre de gérer l'exportation en CSV
		var NomCSV = "HeuresGlissantes_" + P_dayInit;
		var Ext = ".CSV";
		var FicPDF = "";
                var WLigTab = $("#ID_Table_Data").length;
		var WLigneCSV = "TRANCHES HORAIRES;INTERVALES;NB DEPART;NB ARRIVEE;TOTAL" + "\n";
//		for (var i = 0, l = WLigTab; i < WLigTab; i++) {
//			WLigneCSV = WLigneCSV + TranchesHoraires_X[i] + ";" + Interv[parseInt(i)] + ";"
//			WLigneCSV = WLigneCSV + series[1].data[i] + ";" + series[2].data[i] + ";" + series[0].data[i]
//			WLigneCSV = WLigneCSV + "\n";
//		}
		console.log("WLigTab="+WLigTab);
		console.log("WLigneCSV="+WLigneCSV);
	}
}

[Zebulon777]

Je ne comprends pas avec var WLigTab = $("#ID_Table_Data").length;, j'ai toujours 1 dans la variable !!!
On dirait que ça ne renvoie pas le nombre de lignes de la table.
Comprends pas !

[NoSmoking]

Bonjour,
visiblement tu n'as pas bien compris le fonctionnement de la fonction déclarée dans l'option contentToOption.

Dans la fonction de cette option est passé en paramètre le code HTML contenu dans ta dataView tel qu'écrit dans ta fonction associée à l'option optionToContent, avec les modifications si il y en a eu, ni plus ni moins.

Place un console.log pour t'en rendre compte.

Code :

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

1
2
3
contentToOption:  function(data){
  console.log("contentToOption : ",data);
},

En natif Echarts possède une fonction de décodage basée sur la récupération de la <textarea>, élément conteneur par défaut. C'est donc à toi de récupérer à la mano les données fonction du format que tu as injecté.

C'est la fin de la journée, donc je dois surement passer à côté d'un truc tout bête,

Je le crois aussi

Je ne comprends pas pourquoi tu t'évertues à vouloir récupérer des données non modifiées, si j'ai bien compris, alors qu'il te suffit de faire un data = oEchart.getOption() et de traiter data, ou encore d'utiliser directement les valeurs misent dans les options de départ de ton graphique !

Ce que tu mets en place me paraît bien compliqué, surtout au regard de tes autres discussions.

[Zebulon777]

J'ai un esprit alambiqué

Mais , toujours de bons conseils, toi , que je vais donc suivre et utiliser les valeurs déjà mises dans le graphique.

[Zebulon777]

Histoire de clore le sujet, voici ce que j'ai fait :

Code javascript :

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
56
57
58
59
60
61
62
63
 
var WLigneCSV = "TRANCHES HORAIRES;INTERVALES;NB DEPART;NB ARRIVEE;TOTAL" + "\n";
...
...
...
dataView: {
	show: true, // Affiche ou non l'icône pour afficher les données utilisées.
	readOnly: false,
	backgroundColor: '#88ABD9',
	title: 'Données',
	lang: ['Données utilisées pour le graphique...', 'Retour', 'Export CSV'], 
	optionToContent: function(opt) {
		if (P_Plateforme == "LFPO")
			{
				$('#Info_lfpo_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		if (P_Plateforme == "LFPG")
			{
				$('#Info_lfpg_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		if (P_Plateforme == "LFPB")
			{
				$('#Info_lfpb_hg').css('display','none'); // Effacement de la DIV Info_lfpo_hg
			}
		var axisData = opt.xAxis[0].data;
		var series = opt.series;
		var WTable01 = '<div id="ID_Table_Data">';
		WTable01 = WTable01 + '<table class="table-fill">';
		WTable01 = WTable01 + '<thead><tr>';
		WTable01 = WTable01 + '<th class="text-center" style="width:120px">Tranches Horaires</th>'
		WTable01 = WTable01 + '<th class="text-center" style="width:120px">Intervales</th>'
		WTable01 = WTable01 + '<th class="text-center">' + series[1].name + '</th>';
		WTable01 = WTable01 + '<th class="text-center">' + series[2].name + '</th>';
		WTable01 = WTable01 + '<th class="text-center">' + series[0].name + '</th>';
		WTable01 = WTable01 + '</tr></thead>';
		WTable01 = WTable01 + '<tbody class="table-hover">';
		for (var i = 0, l = axisData.length; i < l; i++) {
			WLigneCSV = WLigneCSV + TranchesHoraires_X[i] + ";" + Interv[parseInt(i)] + ";"
			WLigneCSV = WLigneCSV + series[1].data[i] + ";" + series[2].data[i] + ";" + series[0].data[i]
			WLigneCSV = WLigneCSV + "\n";
			WTable01 += '<tr>'
					 + '<td class="text-center">' + TranchesHoraires_X[i] + '</td>'
					 + '<td class="text-center">' + Interv[parseInt(i)] + '</td>'
					 + '<td class="text-center">' + series[1].data[i] + '</td>'
					 + '<td class="text-center">' + series[2].data[i] + '</td>'
					 + '<td class="text-center">' + series[0].data[i] + '</td>'
					 + '</tr>';
		}
		WTable01 += '</div></tbody></table>';
		return WTable01;
	},
	contentToOption: function(){ // Va permetrtre de gérer l'exportation en CSV
		var NomCSV = "HeuresGlissantes_" + P_dayInit;
		var Ext = ".CSV";
		var FicCSV = NomCSV + Ext;
// Ecrire le contenu de la variable WLigneCSV dans un fichier
		download(FicCSV, WLigneCSV);
 
	}
}
...
...
...

Et ça fonctionne impec.

Merci encore et comme toujours pour l'aide préciseuse.

[NoSmoking]

Histoire de clore le sujet

c'est toi qui vois mais pour moi ton code est une Horreur

Mettre du code dans l'option de la dataView, code qui n'a rien à voir avec cette dataView est un non sens au niveau de la structure de ton code et pour une maintenance ultérieure.

Ta fonction « convertToCSV » devrait être autonome, l'affichage de tes données également ... en gros tu n'as pas besoin de dataView mais bon !!!!

PS : pense à fermer ton autre discussion [Echarts 4] Comportement du Dataview