Afficher des informations en plus de la légende

Version imprimable

26/09/2018, 11h03
Zebulon777

Afficher des informations en plus de la légende

Bonjour tout le monde,

Sur les graphes, on affiche la légende, mais en plus de cette légende, dans un autre cadre du même genre, je voudrai pouvoir afficher d'autres informations.

Est-ce que c'est possible, siouplé ?

Merci d'avance.
26/09/2018, 17h46
NoSmoking

Bonjour,

Citation:

Est-ce que c'est possible, siouplé ?

c'est plus que probable :aie:

Qu'entends tu exactement par « en plus de cette légende, dans un autre cadre du même genre » ?
27/09/2018, 08h03
Zebulon777

1 pièce(s) jointe(s)

Bonjour et merci encore de te pencher sur mon cas ;)

Et comme une image vaut mieux qu'on long discours...
Pièce jointe 415251

L'idée, serait donc d'ajouter des infos dans une partie blanche du pourtour du graphe, tout en ne modifiant ni la légende, ni le nom des axes.

:koi: là on est dans de la simple structure HTML ni plus ni moins !

Sachant que tout ce qui se trouve dans le conteneur du graphique est purement et simplement supprimer, il suffit de mettre un cadre autour et de mettre tes « infos supplémentaires » dedans.
Code:

1 2 3 4 5 6 7 8 <div id="cadre-graphe"> <div id="graphe"> <p>Cet élément va être supprimé et remplacé par le graphique ...</p> </div> <div> <p>Ici tu mets ce que tu veux ...</p> </div> </div>

27/09/2018, 16h01
Zebulon777

Sauf que pratiquement toute la page est créée dynamiquement et là, c'est le hic ;)

Est-ce que je peux t'envoyer une bonne partie du code (html, js et css), parce que si je le mets en forum, ça risque de faire trop ?
27/09/2018, 16h07
NoSmoking

Citation:

Sauf que pratiquement toute la page est créée dynamiquement et là, c'est le hic ;)

Le « cih » c'est que tu peux également créer l'élément dynamiquement :D

LOL, y a du hic.

Voici les fonctions qui permettent de créer les DIV

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
	function initHTML(rowID){
		var html = "";
		for (var i = 0; i < rowID.length; i++) {
			html += '<div class="row graph" id='+rowID[i]+'>';
			html += '</div>';
			html += '<div id=Info_'+rowID[i]+'>ici tu mets ce que tu veux';
			html += '</div>';
		}
		$('#main').append(html);
	}

	function addHTML(rowID, graphArrayID, graphArraySize){
		var html = "";
		for (var i = 0; i < graphArrayID.length; i++) {
			html += '<div class="col-md-'+graphArraySize[i]+'">';
			html += '<div class="col-md-12 graph-content" id="'+graphArrayID[i]+'"></div>';
			html += '<div class="col-md-12 graph-loading"><span><i class="fa fa-line-chart fa-lg"></i> Chargement...</span></div>';
			html += '</div>';
		}
		$('#'+rowID).append(html);
	}

J'ai ajouté ce qui est en bleu et qui devrait correspondre à "ici tu mets ce que tu veux", ok, c'est bon, ça le fait, mais l'info est affiché hors du cadre du graphe ?

27/09/2018, 19h05
NoSmoking

Citation:

...mais l'info est affiché hors du cadre du graphe ?

certes mais c'est une vue de l'esprit, il te suffit de reporter le style (cosmétique) appliqué à ton conteneur de graphe, son parent donc.
28/09/2018, 10h53
Zebulon777

Impec.
C'est tout simple et je n'y avais pas pensé ;)
Merci.