Highcharts Gruppierten Säulendiagramm mit Mehreren Gruppen?

Ich bin auf der Suche zum erstellen eines gruppierten Säulendiagramms in Highcharts, außer mit mehreren Gruppen in einem bestimmten Tag. Der graph Aussehen würde, wie diese http://www.highcharts.com/demo/column-stacked-and-grouped (aus diesem forum Frage http://highslide.com/forum/viewtopic.php?f=9&t=19575), außer mit jedem gestapelten Balken ersetzt, die mit einer Gruppierung von Spalten (nicht gestapelt). Daher möchten wir sehen mehrere Gruppen von Spalten pro Tag, wobei die Idee, dass jede Gruppe entspricht einem user. Weiß jemand, wie dies zu tun?

edit: Hier ein jsfiddle habe ich gefunden 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>

aus dem thread hier http://highcharts.uservoice.com/forums/55896-general/suggestions/2230615-grouped-x-axis#comments. Der code für die x-Achse in Schritten ist ein bisschen langweilig, obwohl, weil Sie müssen manuell hinzufügen jedes Inkrement und Ihre Abstände, um sicherzustellen, dass Ihre Daten Punkte-Linie. Ich habe getan, Diagrammen zuvor, wo Sie können, anstatt geben Sie eine pointStart und pointInterval für Termine. Wenn jemand kennt eine elegantere Lösung, das wäre toll.

Ich bin mir nicht sicher, wie das Aussehen soll. Könnte Sie entfernen Sie einfach stapeln? Vielleicht können Sie zeigen einfache mockup für diese?
Sorry, hier ist ein jsfiddle ein Beispiel, das ich gefunden habe jsfiddle.net/pMA2H/1. Das ist das, was ich suchte; nur gefragt, wenn jemand hatte, befasste sich mit dieser Art von gruppierten Säulendiagramm vor und hatte eine Lösung.
Geben Sie dieses plugin zu versuchen, wenn mit Highcharts blacklabel.github.io/grouped_categories

InformationsquelleAutor Flash | 2013-04-30

2

Können Sie verwenden-plugin für Kategorien gruppiert, hier finden Sie es: https://github.com/blacklabel/grouped_categories

danke @pawel, ich nehme einen Blick auf diese.
das sieht gut aus für das, was ich brauche, vielen Dank nochmal @Pawel

InformationsquelleAutor Paweł Fus
2

Ich hatte das gleiche problem und es gelöst usign plain HighCharts. Es braucht einige Magische datashuffling, aber das Ergebnis ist fair.

Siehe hier: https://stackoverflow.com/a/31029535/461499

InformationsquelleAutor RobAu
1

Es sei denn, es ist etwas anderes, das man nicht erklären, was Sie Fragen, ist das Standardverhalten von einem gruppierten Säulendiagramm:

http://jsfiddle.net/jlbriggs/TfvGp/
```
.
```
alle, die erforderlich ist, um dies zu erreichen, ist mehrere Datenreihen und eine Art von 'Spalte'

InformationsquelleAutor jlbriggs
1

Um dieses problem zu lösen, u müssen, um Stapel auf eine variable, die nicht stapeln kann. Wie:
Serie :{
```
{ 
    name: 'boys', 
    stack: 1,
    data: [2, 6, 5,0] 
} 

{ 
    name: 'girls', 
    stack: 2,
    data: [0, 6, 1,3] 
} 
```
}
Kein stapeln mit 1,2,3,4 e.t.c

InformationsquelleAutor crystoline

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.