Highcharts et JSON

Bonjour,

J'ai un fichier data.json avec la structure suivante :

Code:

1
2
3
4
 
[{"metier":"directeur","total":197555},
{"metier":"employe","total":4717},
{"metier":"technicien","total":15513}]

Dans mon javascript ci-dessous, j'appelle mon fichier data.json et je le formatte pour qu'il puisse me créer un histogramme avec des colonnes mais cela ne marche pas :-(

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
<!DOCTYPE HTML>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>Highcharts Example</title>
 
 
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/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">
 
    $.getJSON('data.json', function(data) {
    var output = [];
 
    $.each(data,function(i,d){
        output.push({
            name: d.metier,
            y: d.total
        });
    });
 
    $('#container').highcharts({
        chart:{
            type:'column'
        },
        xAxis:{
            type:'category'
        },
        series: [{
            name: 'Tokyo',
            data: output
        }]
    });
 
 
});
		</script>
 
	</head>
	<body>
 
		<!-- 3. Add the container -->
		<div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>
 
 
	</body>
</html>