how to draw multiple bar charts grouped by categor

2019-05-26 20:11发布

问题:

I'm using flot library to display a bar charts and I need to group by certain value in this way:

|
|          +----+        +----+    
|          |    |        |    |    
|          |    |        |    |    
|          |    |        |    |    
| +----+   |    |        |    |    
| |    |   |    |        |    |    
| |    |   |    |        |    |    
| |    |   |    |        |    |    
|-+----+---+----+--------+----+----
   val 1    val2          val3
    category #1        category #2

Thanks Sergey G. for the Ascii :)

I have the variables d1, d2, d3 to the values ​​of the bars 1, 2 and 3 respectively (sorted by category). The question is: How do I add the category below ticks? Sorry for my bad "Google-Translator" English and thank you very much!

Code:

$.plot(
    $("#placeholder"),
    [

            {
        label: labelChart,
        data: d1,
        color: '#92d5ea',
        bars: {
            show: true,
            barWidth: 0.5,
            align: "center",
            order:2
        },   

       multiplebars:true  
    },
    {
        label: labelChart,
        data: d2,
        color: '#92d5ea',
        bars: {
            show: true,
            barWidth: 0.5,
            align: "center",
            order:3
        },   

       multiplebars:true  
    },
    {
        label: labelChart,
        data: d3,
        color: '#92d5ea',
        bars: {
            show: true,
            barWidth: 0.5,
            align: "center",
            order:3
        },   

       multiplebars:true  
    }


    ],
    {
        xaxis: {
            ticks: ticksData
        }, 

        yaxis: { 
            min:0
        }
    }
);

回答1:

Use the categories plugin, as demonstrated in this example.