$(document).ready(function() {
chart1 = new Highcharts.Chart({
chart: {
renderTo: 'QueryResultsChart',
type: 'bar'
},
title: {
text: 'Production History'
},
xAxis: {
title: {
text: 'Production Day'
},
type: 'datetime'
},
yAxis: {
title: {
text: 'Gross Production'
}
},
series: [{
name: 'Data',
data: []
}]
});
chart1.series[0].setData(". json_encode($aChartData) .");
});
Les données sont correctes, elles ne font que montrer mon xAxis sur le yAxis pour une raison quelconque ...
Les graphiques à barres Vetical sont appelés column
's dans Highchart.
Change ça:
type: 'column' //was 'bar' previously
Voir exemple ici: http://jsfiddle.net/aznBb/
Pour développer la réponse de Moin Zaman, j'ai joué avec son jsfiddle http://jsfiddle.net/aznBb/ et j'ai trouvé ceci.
C'est horizontal.
chart: {
type: 'bar',
inverted: false // default
}
C'est aussi horizontal.
chart: {
type: 'bar',
inverted: true
}
C'est vertical.
chart: {
type: 'column',
inverted: false // default
}
Ceci est horizontal et apparemment identique aux graphiques à barres.
chart: {
type: 'column',
inverted: true
}
Très étrange. Je ne peux que deviner que type: 'bar'
aliases type: 'column'
et force inverted: true
quel que soit le paramètre défini. Ce serait bien si on changeait simplement le inverted
boolean.
Vous devriez essayer quelque chose comme ça:
$(function () {
Highcharts.chart('container', {
chart: {
type: 'columnrange',
inverted: false
},
title: {
text: 'Temperature variation by month'
},
subtitle: {
text: 'Observed in Vik i Sogn, Norway'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
yAxis: {
title: {
text: 'Temperature ( °C )'
}
},
tooltip: {
valueSuffix: '°C'
},
plotOptions: {
columnrange: {
dataLabels: {
enabled: true,
formatter: function () {
return this.y + '°C';
}
}
}
},
legend: {
enabled: false
},
series: [{
name: 'Temperatures',
data: [
[-9.7, 9.4],
[-8.7, 6.5],
[-3.5, 9.4],
[-1.4, 19.9],
[0.0, 22.6],
[2.9, 29.5],
[9.2, 30.7],
[7.3, 26.5],
[4.4, 18.0],
[-3.1, 11.4],
[-5.2, 10.4],
[-13.5, 9.8]
]
}]
});
});