Отображение баров с флотом

Проблема с моими галочками Xaxis, только первый галочка отображается в правой части графика, и столбцы не отображаются. У меня такое чувство, что я упускаю что-то очевидное.

предыдущая графика

Желаемое решение: показать все отметки по оси X и построить соответствующие столбцы

Связанный код:

$.plot($("#chart"), results, {
    grid: {
        hoverable: true,
        aboveData: true
    },
    xaxis: {
        ticks: [
            [1, "AL"],
            [2, "AZ"],
            [3, "CA"],
            [4, "CO"],
            [5, "CT"],
            [6, "DE"],
            [7, "FL"],
            [8, "GA"],
            [9, "HI"],
            [10, "IA"],
            [11, "IL"],
            [12, "IN"],
            [13, "KS"],
            [14, "KY"],
            [15, "LA"],
            [16, "MA"],
            [17, "MD"],
            [18, "ME"],
            [19, "MI"],
            [20, "MN"],
            [21, "MO"],
            [22, "MS"],
            [23, "NC"],
            [24, "NE"],
            [25, "NJ"],
            [26, "NM"],
            [27, "NY"],
            [28, "OH"],
            [29, "OK"],
            [30, "OR"],
            [31, "PA"],
            [32, "RI"],
            [33, "SC"],
            [34, "TN"],
            [35, "TX"],
            [36, "UT"],
            [37, "VA"],
            [38, "WA"],
            [39, "WV"]
        ],
        tickSize: 1,
        tickLength: 1
    },
    grid: {
        hoverable: true,
        clickable: false,
        borderWidth: 1
    },
    legend: {
        labelBoxBorderColor: "none",
        position: "ne",
        margin: [-100, 0]
    },
    series: {
        bars: {
            show: true,
            align: "center",
            horizontal: "true"
        }
    }
});

JSFiddle: http://jsfiddle.net/emaM7/

1 ответ

Решение

Я думаю, что проблема может быть просто в том, что вы используете не числовые значения X в ваших данных. Я добавил этот код перед вызовом сюжета:

for (i = 0; i < results.length; i++) {
    for (j = 0; j < results[i].data.length; j++) {
        results[i].data[j][0] = j;
    }
}

с этим отображается график, как и метки.

Возможно, вы захотите использовать немного более сложную логику для выбора правильного числового кода для каждого состояния, так как то, что я написал, не будет работать, если у вас отсутствуют или вышли из строя состояния в объекте "results".

Другие вопросы по тегам