Bonjour à tous,
Voilà! j'ai besoin de réaliser un graphique en HTML pour l'intégrer à une fiche produit sur un site E-commerce. Il s'agit d'une pompe pour piscine; elle se décline en plusieurs puissances et il est intéressant pou les acquéreurs potentiels de visualiser ces courbes exprimés en en ordonné "H(m.C.A)" et en abscisse "Q(m3/h)".

Je problème que je rencontre est que je ne sais pas comment intervertir ces valeurs sur le graphique que j'ai créé!

Le deuxième petit problème est que je ne sais pas non plus afficher "H(m.C.A)" et "Q(m3/h)" au pied et sur le côté de ce dit graphique.

Est ce que quelqu'un aurait la gentillesse de ce pencher sur mon cas et me trouver une solution?

J'attends de vos nouvelles...

Bien cordialement.

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
<script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"><!--
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = new google.visualization.DataTable();
	data.addColumn('string', 'Q (m3/h)');
        	data.addColumn('number', '0,75CV');
        	data.addColumn('number', '1CV');
	data.addColumn('number', '1,5CV');
	data.addColumn('number', '2CV');
	data.addColumn('number', '3CV');
        	data.addRows(8);
 
	data.setValue(0, 0, '6');
        	data.setValue(0, 1, 17.5);
        	data.setValue(0, 2, 21);
	data.setValue(0, 3, 28.5);
	data.setValue(0, 4, 34);
	data.setValue(0, 5, 43.5);
 
	data.setValue(1, 0, '8');
        	data.setValue(1, 1, 15);
        	data.setValue(1, 2, 19.5);
	data.setValue(1, 3, 26);
	data.setValue(1, 4, 30);
	data.setValue(1, 5, 42);
 
	data.setValue(2, 0, '10');
        	data.setValue(2, 1, 12);
        	data.setValue(2, 2, 17.5);
	data.setValue(2, 3, 24);
	data.setValue(2, 4, 27);
	data.setValue(2, 5, 40);
 
	data.setValue(3, 0, '12');
        	data.setValue(3, 1, 8.8);
        	data.setValue(3, 2, 15);
	data.setValue(3, 3, 21);
	data.setValue(3, 4, 24);
	data.setValue(3, 5, 35);
 
	data.setValue(4, 0, '14');
        	data.setValue(4, 1);
        	data.setValue(4, 2, 12);
	data.setValue(4, 3, 18);
	data.setValue(4, 4, 20);
	data.setValue(4, 5, 31);
 
	data.setValue(5, 0, '16');
	data.setValue(5, 1);
        	data.setValue(5, 2, 9);
	data.setValue(5, 3, 15);
	data.setValue(5, 4, 16);
	data.setValue(5, 5, 24);
 
	data.setValue(6, 0, '18');
	data.setValue(6, 1);
        	data.setValue(6, 2);
	data.setValue(6, 3);
	data.setValue(6, 4);
	data.setValue(6, 5, 17);
 
	data.setValue(7, 0, '20');
	data.setValue(7, 1);
        	data.setValue(7, 2);
	data.setValue(7, 3);
	data.setValue(7, 4);
	data.setValue(7, 5);
 
        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
        chart.draw(data, {width: 400, height: 240, title: 'Courbes de performances'});
      }
// --></script>
<div id="chart_div">&nbsp;</div>