Highcharts - Graphique en aires avec valeurs négatives
Voici un exemple de graphique en aires avec des valeurs négatives.
Nous avons déjà vu la configuration utilisée pour dessiner un graphique dans le chapitre Syntaxe de configuration Highcharts . Voyons maintenant un exemple de graphique à aires avec des valeurs négatives.
Exemple
highcharts_area_negative.htm
<html>
<head>
<title>Highcharts Tutorial</title>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
<script src = "https://code.highcharts.com/highcharts.js"></script>
</head>
<body>
<div id = "container" style = "width: 550px; height: 400px; margin: 0 auto"></div>
<script language = "JavaScript">
$(document).ready(function() {
var chart = {
type: 'area'
};
var title = {
text: 'Area chart with negative values'
};
var xAxis = {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
};
var credits = {
enabled: false
};
var series = [
{
name: 'John',
data: [5, 3, 4, 7, 2]
},
{
name: 'Jane',
data: [2, -2, -3, 2, 1]
},
{
name: 'Joe',
data: [3, 4, 4, -2, 5]
}
];
var json = {};
json.chart = chart;
json.title = title;
json.xAxis = xAxis;
json.credits = credits;
json.series = series;
$('#container').highcharts(json);
});
</script>
</body>
</html>Résultat
Vérifiez le résultat.