JQPlot - Stacked Horizontal Bar Chart - No Bars When Stacked

问题

Having a strange issue with jqplot. I've created a horizontal bar chart with 2 series and 5 labels; all populated with variables from a table.

var plot1 = $.jqplot('chart1', [
    [[SERIESA[0],TITLE[0]], [SERIESA[1],TITLE[1]], [SERIESA[2],TITLE[2]], [SERIESA[3],TITLE[3]], [SERIESA[4],TITLE[4]]], 
    [[SERIESB[0],TITLE[0]], [SERIESB[1],TITLE[1]], [SERIESB[2],TITLE[2]], [SERIESB[3],TITLE[3]], [SERIESB[4],TITLE[4]]]], {
    seriesDefaults: {
        renderer:$.jqplot.BarRenderer,
        // Show point labels to the right ('e'ast) of each bar.
        // edgeTolerance of -15 allows labels flow outside the grid
        // up to 15 pixels.  If they flow out more than that, they 
        // will be hidden.
        pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
        // Rotate the bar shadow as if bar is lit from top right.
        shadow: false,
        // Here's where we tell the chart it is oriented horizontally.
        rendererOptions: {
            barDirection: 'horizontal'
        }
    },
    axes: {
        yaxis: {
            renderer: $.jqplot.CategoryAxisRenderer
        }
    }
});

This renders a lovely horizontal bar chart. I would like for the 2 series to be stacked under each label, but when I add the line

stackSeries: true,

above my seriesDefaults my bars all vanish. Everything else (labels, ticks, etc) remains the same. Is there something in addition to the stackSeries option I need to add?

Thanks in advance! Karl

回答1:

I am not sure what might be the reason with your code, what you showed appears to be all right. Maybe something wrong with the way you set the data, but then again it wouldn't work at all.

Check out my example it might help you out.

回答2:

I found a way to fix my problem (not entirely, but sufficiently for my need). This issue only occurs when I use custom lables pulled from somewhere else; if I use generic "1,2,3,4,etc." the graph stacks properly and shows data. Ideally I would have custom lables, but I can just put a simple table beside the graph to act as the axis labels.

回答3:

Actually you can have custom labels, by adding tickt, for example:

 xaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                tickOptions: {
                    angle: -90
                },
                labelOptions: {
                    fontSize: '11pt',
                },
                ticks: ['tick 1', 'tick 2'],
            }

来源：https://stackoverflow.com/questions/10412439/jqplot-stacked-horizontal-bar-chart-no-bars-when-stacked

标签

options

jqplot

bar-chart

stacked