Highcharts Regroupées Diagramme à Colonnes avec Plusieurs Groupes?
Je suis à la recherche pour créer une colonne groupée graphique dans Highcharts, sauf avec plusieurs groupes dans une journée donnée. Le graphique devrait ressembler à ceci http://www.highcharts.com/demo/column-stacked-and-grouped (à partir de ce forum question http://highslide.com/forum/viewtopic.php?f=9&t=19575), sauf avec chaque diagramme à barres empilées remplacé par un groupe de colonnes (non superposés). On devrait donc voir plusieurs groupes de colonnes par jour, l'idée étant que chaque groupe correspond à un seul utilisateur. Personne ne sait comment faire cela?
edit: Voici un jsfiddle j'ai trouvé http://jsfiddle.net/pMA2H/1/
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>ElementStacks - jsFiddle demo</title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<link type="text/css" href="/css/normalize.css"/>
<link type="text/css" href="/css/result-light.css"/>
<script type='text/javascript' src="http://highcharts.com/js/testing.js"></script>
<style type='text/css'>
</style>
<script type='text/javascript'>//<![CDATA[
$(function(){
/*
Data is:
Gross Amount Cost Amount
Services Australia 20 10
Germany 30 15
Manufacturing Australia 35 17
Germany 25 12
----
Would like to be able define my categories hierarchically - example:
xAxis: [{
categories: [{
name: 'Services'
children: ['Australia', 'Germany']
},{
name: 'Manufacturing'
children: ['Australia', 'Germany']
}]
}]
and get a result similar to what is fudged up by using the renderer on the right.
*/
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'column'
},
xAxis: [{
categories: ['Australia', 'Germany', 'Australia', 'Germany'],
labels: {
y: 40
}
}],
legend: {
margin: 40
},
series: [{
name: 'Gross',
data: [['Services', 20],['Services',30],['Manufacturing', 35],['Manufacturing', 25]]
},{
name: 'Cost',
data: [['Services', 10],['Services',15],['Manufacturing', 17],['Manufacturing', 13]]
}]
}, function(chart){
$('.highcharts-axis:first > text').each(function() {
this.setAttribute('y', parseInt(this.getAttribute('y')) - 20)
});
var text1 = chart.renderer.text("Services", 150, 340).add();
var text2 = chart.renderer.text("Manufacturing", 350, 340).add();
});
});//]]>
</script>
</head>
<body>
<div id="container" style="height: 400px; width: 500px"></div>
</body>
</html>
à partir du thread ici http://highcharts.uservoice.com/forums/55896-general/suggestions/2230615-grouped-x-axis#comments. Le code pour l'axe des x incréments est un peu fastidieux, parce que vous devez l'ajouter manuellement chaque incrément et inclure un espacement assurez-vous que les points de données en ligne. J'ai fait des graphes précédemment où vous pouvez spécifier à la place d'un pointStart et pointInterval pour les dates. Si quelqu'un connaît une solution plus élégante, je veux bien.
Désolé voici un jsfiddle d'un exemple que j'ai trouvé jsfiddle.net/pMA2H/1. C'est ce que je cherchais; me demandais si quelqu'un avait traité ce genre de regroupées diagramme à colonnes avant et avait une solution.
Donner ce plugin à essayer si vous utilisez Highcharts blacklabel.github.io/grouped_categories
OriginalL'auteur Flash | 2013-04-30
Vous devez vous connecter pour publier un commentaire.
Vous pouvez utiliser le plugin pour regrouper des catégories, ici vous pouvez trouver: https://github.com/blacklabel/grouped_categories
cela semble bon pour ce que j'en ai besoin, merci encore @Pawel
OriginalL'auteur Paweł Fus
J'ai eu le même problème, résolu avec la plaine HighCharts. Il a besoin de quelque magique datashuffling, mais le résultat est juste.
Voir ici: https://stackoverflow.com/a/31029535/461499
OriginalL'auteur RobAu
Sauf si il y a autre chose, vous ne sont pas d'expliquer, ce que vous demandez est le comportement par défaut d'une colonne groupée graphique:
http://jsfiddle.net/jlbriggs/TfvGp/
tout ce qui est nécessaire pour atteindre cet est de plusieurs séries de données et d'un type de 'colonne'
OriginalL'auteur jlbriggs
Pour résoudre ce problème, u besoin de pile sur une variable qui n'est pas de pile. Comme:
série :{
}
Aucun empilement avec 1,2,3,4 e.t.c
OriginalL'auteur crystoline