plugin Highcharts, gestion des données

Version imprimable

salut,

j'espère que je suis dans le bon espace de forum pour traiter mon problème
le code suivant sert a afficher le statistique sous forme de comenbert

Code:

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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core">
<head>
<title>page test</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Mon exemple Example</title>
 
 
 
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="../js/highcharts.js"></script>
 
 
		<script type="text/javascript" src="../js/modules/exporting.js"></script>
 
 
 
		<script type="text/javascript">
 
			var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'container',
						plotBackgroundColor: null,
						plotBorderWidth: null,
						plotShadow: false
					},
					title: {
						text: 'Browser market shares at a specific website, 2010'
					},
					tooltip: {
						formatter: function() {
							return '<b>'+ this.point.name +'</b>: '+ this.y +' %';
						}
					},
					plotOptions: {
						pie: {
							allowPointSelect: true,
							cursor: 'pointer',
							dataLabels: {
								enabled: true,
								color: '#000000',
								connectorColor: '#000000',
								formatter: function() {
									return '<b>'+ this.point.name +'</b>: '+ this.y +' %';
								}
							}
						}
					},
				    series: [{
						type: 'pie',
						name: 'Browser share',
						data: [
							['Firefox',   45.0],
 
							{
								name: 'Chrome',    
								y: 12,
								sliced: true,
								selected: true
							},
                                                       ['Others',  43 ]
 
						]
					}]
				});
			});
 
		</script>
 
	</head>
	<body>
 
		<!-- 3. Add the container -->
		<div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
 
 
	</body>

mais comme vous voyer les donnes sont saisis statiquement sont le code javascript

mon but que les valeurs comme dans cette ligne ['Firefox', 45.0] seront remplir d'un autre emplacement .le but dans cette étape est quel sera le changement attribué a le code de javascript pour qu'il peut remplir ces donnes d'un autre emplacement

le but pour le moment ne pas connaitre comment les donnes seront envoyer a cette page et précisément a javascript

je pense que le code de javascript doit contient &valeur=...

et peut être un tableau car on connait pas a l'avance les nombre de valeurs par exemple dans mon cas: firefox 45
chrome 12

ces donnés seront envoyer d'un autre emplacement

11/03/2011, 08h43
x-zolezzi

Je ne sais pas si j'ai bien compris ta question, mais je pense que tu pourrais faire une requête ajax pour charger les données que tu veux envoyer.
11/03/2011, 11h15
danielhagnoul

Bonjour

plugin Highcharts, gestion des données, documentation : http://highcharts.com/documentation/how-to-use
12/03/2011, 21h55
mdh12

merci pour vos réponse

je consulter votre lien pour jQuery

le but est d'envoyer les données sous formes d'objet grâce à une servlet

mais je n'arrive pas à faire le lien entre ces valeurs envoyée et cette la notion de jquery

pouvez m'aidez à corriger la page donnée xhtml pour qu'elle traite les donnés envoyés grâce a cette notion

moi je dois récupérer les donnes je parle de ces données

Code:

['Firefox', 45.0], et de chrome :43 et pour other 42

d'un fichier test.xml

qui contient
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <?xml version="1.0" encoding="UTF-8"?> <applications> <application id="1"> <nom>fireFox</nom> <occupation>45%</occupation> </application> <application id="2"> <nom>Chrome</nom> <occupation>12.8%</occupation> </application> </applications>
pouvez me donnes une idée dont lequel j'arrive à envoyer les données en utilisant Ajax

merci d'avance

Bonsoir

Exemple de transaction XML en jQuery 1.5.1

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var tabXML = [];
 
$.post("XML-1.xml", function(data){
	$(data).find("applications").children("application").each(function(i, item){
		tabXML.push([$(item).attr("id"), $(item).children("nom").text(), $(item).children("occupation").text()]);
	});
}, "xml").error(function(){
	alert("Échec de la transaction XML")
}).complete(function(){
	// la transaction s'est terminée soit par un succès soit par un échec
	if (tabXML.length > 0){
		// exemple d'utilisation
		alert("Taux d'occupation de " + tabXML[1][1] + " = " + tabXML[1][2]);
	}
})

14/03/2011, 13h08
mdh12

le but est comment intégrer votre exemple pour mon cas

je veux avancé mais le problème est le point de départ

je vous donne le fichier .xhtm initiale qui affiche le statistique sous forme de camembert mais le problème les valeurs ne sont pas extraire de mon fichier Test.xml

après je vous donne exemple de fichier Test.xml qui je le met sous le dossier WebContent de mon projet

et je fait une proposition que je pense quel est correcte dans le code de fichier .xhtml qui adopte avec votre exemple

mais rien n'est afficher et je ne sais pas vraiment quel est le problème est ce que problème de codage ou problème de syntaxe
14/03/2011, 20h19
mdh12

je sais que la requête Ajax est asynchrone.
donc ma requête ne doit donc pas se trouver au beau milieu de mes données pour HighCharts. Elle doit être exécutée séparément, avant, et la totalité de l'appel de Highcharts doit se trouver dans le callback de la requête.

mais je n'arrive pas à trouvez une solution