如何使用flot js绘制按类别分组的多个条形图

2024-01-14

我正在使用 flot 库来显示条形图,我需要以这种方式按特定值进行分组:

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

感谢 Sergey G. 的 Ascii :)

我将变量 d1、d2、d3 分别设置为柱 1、2 和 3 的值(按类别排序)。 问题是: 如何添加下面的类别? 抱歉我的“谷歌翻译”英语不好,非常感谢!

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
        }
    }
);

使用类别插件,如所示这个例子 http://www.flotcharts.org/flot/examples/categories/index.html.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用flot js绘制按类别分组的多个条形图 的相关文章

随机推荐