Данные jqPlot в той же серии располагаются друг на друге - PullRequest
0 голосов
/ 14 октября 2011

У меня небольшая проблема с диаграммой jqplot, которую я пытаюсь создать.

Я хочу поместить все данные за 2008 год в одну категорию и стилизовать их под определенный цвет, а затем сделать то же самое для 2009 года.

В настоящее время у меня есть этот вывод:

как выглядит текущий график (ссылка imgur)

Используя этот код:

$(document).ready(function(){
    // For horizontal bar charts, x an y values must will be "flipped"
    // from their vertical bar counterpart.
    var plot2 = $.jqplot('tableTest', [
        [[10,2008], [12,2008], [11,2008], [13,2008]],
        [[2,2009], [4,2009], [6,2009], [3,2009],]
        ], {
        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.
            shadowAngle: 135,
            // Here's where we tell the chart it is oriented horizontally.
            rendererOptions: {
                barDirection: 'horizontal'
            }
        },
        axes: {
            yaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,

                /*rendererOptions: {
                    groupLabels:['Fruits', 'Vegetables']
                }*/

            }
        }
    });
});

Кто-нибудь знает, как я могу отделить решетку?

Заранее спасибо

1 Ответ

0 голосов
/ 14 октября 2011

Вы добавляете свои собственные тики и форматируете данные немного по-другому.Я внес коррективы в код в jsFiddle :

$(document).ready(function(){
    // For horizontal bar charts, x an y values must will be "flipped"
    // from their vertical bar counterpart.

    var ticks = ['2008', '2009'];

    var plot2 = $.jqplot('tableTest', [[10, 2], [12, 3], [11, 6], [13, 3]], {
        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.
            shadowAngle: 135,
            // Here's where we tell the chart it is oriented horizontally.
            rendererOptions: {
                barDirection: 'horizontal'
            }
        },
        axes: {
            yaxis: {
                renderer: $.jqplot.CategoryAxisRenderer,
                ticks: ticks
            }
        }
    });
});
...