首页 文章

如何为每个栏设置jqplot条形图颜色？

提问于
浏览 次
12

我正在尝试设置jqplot条形图条的颜色 . 总会有六个条形图，分为两组条形图 . 以下是绘制数据的示例：

line1 = [6000, 5000, 5500];
 line2 = [16000, 10000, 14000];

到目前为止我使用了以下内容：

seriesColors: ["#F3CBBF", "#BFDDE5", "#CF3501", "#027997", "#CF3501", "#027997"],

但是jqplot每次在前两个条之间交替，而不是使用所有声明的颜色 . 这可能是因为它只确定存在2个系列，每组数据一个 .

有没有办法明确设置条形颜色？

colors jqplot

3 回答

  • -1

    我使用varyBarColor method执行此操作，因此您可以在一个简单的数组中列出不同颜色的条形，就像您已经完成的那样，但如果只有一个系列，它将为每个条形使用这些颜色 . 这是我的代码示例：

    plot1 = $.jqplot('chart1', [s1], {
        title: 'Example Income Graph',
        seriesDefaults:{
            renderer:$.jqplot.BarRenderer,
            rendererOptions:{ varyBarColor : true },
            pointLabels: { show : true }
        },
        axes: {
            xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                label:'Net Growth (%)',
                ticks: ticks
            },
            yaxis:{
              label:'Income (£)',
              tickOptions:{ formatString:'%d'},
              autoscale:true,
              min:0, 
              max:10000
            }
        },
        seriesColors: [ "#eee", "#ccc", "#999"],
        highlighter: { show: false }
    });

    在这张图中，我有一个系列有3个条形，它们各自是不同颜色的灰色 .

    回复于
  • 30

    这是相当古老的，但仍然没有正确的答案，我花了一段时间才弄明白，所以这里就是这样 .

    您需要两件事：设置varyBarColor和一个包含每个系列的系列颜色的系列数组，与seriesDefaults在同一级别传递，例如：

    plot1 = $.jqplot('chart1', [s1, s2], {
            title: 'Example',
            seriesDefaults:{
                renderer:$.jqplot.BarRenderer,
                rendererOptions:{ varyBarColor : true },
                pointLabels: { show : true }
            },
            series: [{seriesColors: ["#F3CBBF", "#BFDDE5", "#CF3501"]},
                     {seriesColors: ["#027997", "#CF3501", "#027997"]}]
            }
    回复于
  • 3

    试试这样

    series:[{renderer:$.jqplot.BarRenderer , seriesColors: ["#F3CBBF", "#BFDDE5", #CF3501","#eee", "#ccc", "#999"] }]
    回复于

相关问题