0

我正在尝试构建一个条形图，其中第一个系列代表收入，接下来的三个代表不同类型的费用。所以第一个系列是一个单一的酒吧，其余三个系列是堆叠的酒吧。这是我的代码。

var s0 = [15, 17, 19, 21];
var s1 = [2, 6, 7, 10];
var s2 = [7, 5, 3, 4];
var s3 = [14, 9, 3, 8];
var ticks = ['May', 'June', 'July', 'August'];
var plot3 = $.jqplot('chart1', [s0, s1, s2, s3], {
    stackSeries: true,
    animate: true,
    seriesDefaults: {
        renderer: $.jqplot.BarRenderer,
        pointLabels: {
            show: true,
        },
        rendererOptions: {
            fillToZero: true,
            barMargin: 30,
            barWidth: 50,
            barPadding: 5,
            barDirection: 'vertical'
        },
    },
    series: [
        {
            disableStack: true,
            label: 'Revenue'
        },
        {label: 'Expense1'}, {label: 'Expense2'}, {label: 'Expense3'}
    ],
    axesDefaults: {
        tickRenderer: $.jqplot.CanvasAxisTickRenderer,
        tickOptions: {
            fontSize: '13pt'
        }
    },
    axes: {
        xaxis: {
            renderer: $.jqplot.CategoryAxisRenderer,
            ticks: ticks
        },
        yaxis: {
        }
    },
    legend: {
        show: true,
        location: 'e',
        placement: 'outside'
    }
});

我已经 disableStack: true为第一个系列添加了将其从堆栈中排除，但图表仍将其视为堆栈的一部分。这是我的代码的输出。

我的代码的输出

有没有办法来解决这个问题 ？谢谢。

4

1 回答 1

1

是的。您作为参数传递的系列的顺序是不正确的。在堆叠系列之前 在单条系列之后，而不是反之亦然......

所以你必须将第一个系列作为最后一个参数......

var plot3 = $.jqplot('chart', [s1, s2, s3, s0], {

然后您需要为最后一个系列将 disableStack 属性设置为“true”...

series: [
    {label: 'Expense1'}, {label: 'Expense2'}, {label: 'Expense3',label: 'Revenue', disableStack: true}
],

...并且您需要根据需要调整列的边距、宽度和填充...

于 2014-01-08T16:02:52.433 回答