Discussion :

[zazze69]

Bonjour,

Je suis plus que débutant en javascript et j'aimerais avoir de l'aide sur un petit probleme rencontré svp:

J'ai installé un code pour un graphique trouvé ici.

Voici le code que j'utilise :

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
56
57
58
59
60
61
62
63
$(function () {
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            title: {
                text: 'Monthly Average Temperature',
                x: -20 //center
            },
            subtitle: {
                text: 'Source: WorldClimate.com',
                x: -20
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                    'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            yAxis: {
                title: {
                    text: 'Temperature (°C)'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                formatter: function() {
                        return '<b>'+ this.series.name +'</b><br/>'+
                        this.x +': '+ this.y +'°C';
                }
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            series: [{
                name: 'Tokyo',
                data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
            }, {
                name: 'New York',
                data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
            }, {
                name: 'Berlin',
                data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
            }, {
                name: 'London',
                data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
            }]
        });
    });
 
});

Je cherche à alimenter ce graphique avec des variables venant d'une autre fonction qui n'est an fait qu'un calcul.
Je poste ici un bout du code parce qu'il y a trop de calcul:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function calculer(){
							
	var facture=parseFloat(document.getElementById('facture').value);
	if (isNaN (facture)  == true)
	{
		alert('Veuillez entrer un chiffre s\'il vous plait');
	}
	else
	{	
	//calcul
	var an2013 = facture * 10;
        facture=facture.toFixed(2);
	an2013=an2013.toFixed(2);
        document.getElementById('an2013').value= an2013;

J'ai bien saisi que les infos sont à mettre là :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
series: [{
                name: 'Tokyo',
                data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
            }, {
                name: 'New York',
                data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
            }, {
                name: 'Berlin',
                data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
            }, {
                name: 'London',
                data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
            }

mais si j'essaye ca :

Code :

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

1
2
3
4
5
series: [{
                name: 'Depenses',
                data: [an2013, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
            },

Forcément ça ne marche pas puisque ma variable ne vient pas de cette fonction. Mais est ce seulement possible de mettre une variable à cette endroit au lieu d'un chiffre et si oui, comment faire pour insérer les variables de ma fonction calculer()??

Merci pour votre aide.

[SylvainPV]

Bonjour,

Tu peux lire des tutoriels sur le scope des variables, ça te sera utile.

Pour faire court :

Code :

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

1
2
3
4
5
6
7
8
9
 
 
var a;  //ici seul a est accessible
function(){
     var b;  //ici a et b sont accessibles
     function(){
           var c;  //ici a, b et c sont accessibles
     }
}

[zazze69]

merci pour la réponse,

J'avais tenté un truc dans le genre, en essayant d'englober ma fonction calculer() à l'interieur de la fonction Highcharts.

Je vais rééssayer.

[Bovino]

N'oublie pas non plus qu'une fonction offre la possibilité de retourner une valeur !

Code :

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

1
2
3
4
function calculer(){
    // tes calculs
    return an2013;
}

puis

Code :

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

1
2
3
4
series: [{
    name: 'Depenses',
    data: [calculer(), 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
},

[zazze69]

Bon voilà j'ai intégrer la fonction du chart à ma fonction calucler() et ca donne :

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
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
82
83
84
85
86
function calculer(){
 
	var facture=parseFloat(document.getElementById('facture').value);
	if (isNaN (facture)  == true)
	{
		alert('Veuillez entrer un chiffre s\'il vous plait');
	}
	else
	{	
	//calcul
	var an2013 = facture * 10; 
	var an2014 = an2013 * 1.08; 
	var an2015 = an2014 * 1.08; 
	var an2016 = an2015 * 1.08; 
	var an2017 = an2016 * 1.08; 
 
	//on tronque à 2 ch après la virgule
	facture=facture.toFixed(2);
	an2013=an2013.toFixed(2);
	an2014=an2014.toFixed(2);
	an2015=an2015.toFixed(2);
	an2016=an2016.toFixed(2);
	an2017=an2017.toFixed(2);
 
 
	//on ecrit dans l'input calcul
	document.getElementById('an2013').value= an2013;	
	document.getElementById('an2014').value= an2014;	
	document.getElementById('an2015').value= an2015;	
	document.getElementById('an2016').value= an2016;
	document.getElementById('an2017').value= an2017;
	}
	$(function () {
 
	var chart;
	$(document).ready(function() {
	chart = new Highcharts.Chart({
 
	chart: {
	renderTo: 'container',
	type: 'line',
	marginRight: 130,
	marginBottom: 25
	},
	title: {
	text: 'test',
	x: -20 //center
	},
	subtitle: {
	text: 'test',
	x: -20
	},
	xAxis: {
	categories: ['2013', '2014', '2015', '2016', '2017']
	},
	yAxis: {
	title: {
	text: 'Consommation (€)'
	},
	plotLines: [{
	value: 0,
	width: 1,
	color: '#808080'
	}]
	},
	tooltip: {
	formatter: function() {
	return '<b>'+ this.series.name +'</b><br/>'+
	this.x +': '+ this.y +'€uros';
	}
	},
	legend: {
	layout: 'vertical',
	align: 'right',
	verticalAlign: 'top',
	x: -10,
	y: 100,
	borderWidth: 0
	}, {
	name: 'DEPENSES',
	data: [100000, 112605, 122033, 134000, 153080]
	});
	});
 
	});
}

Ma fonction de calcul fonctionne toujours et mon graphique fonctionne.

Maintenant comment faire pour mettre dans les series les variables à la place des datas?

[zazze69]

merci Bovino !

En effet je ne le savais pas...
Dois créer une fonction pour chaque valeur que je veux retouner? (pour 2014, 2015...etc) avec un nom différent?

[zazze69]

un grand merci a vous deux !!!
merci de m'avoir mis sur la piste cela fonctionne parfaitement maintenant.