Ось Y строки диаграммы dc.js не в порядке

Я настраиваю серию связанных визуализаций, используя библиотеку dc.js. Все идет гладко, кроме одной мелочи. Я использую гистограмму, чтобы визуализировать ряд оценок пользователей от 1 (худший) до 10 (лучший), однако порядок по оси Y гистограммы неверен, как видно на изображении ниже.

введите здесь описание изображения

Оценка 10 отображается непосредственно под оценкой 1, тогда как она должна отображаться после оценки 9 по оси Y.

Вот мой код для этой диаграммы:

rowChart
    .width(450)
    .height(350)
    .dimension(ratingDim)
    .group(ratingGroup)
    .elasticX(true)
    .renderLabel(true)
    .xAxis().ticks(6)
    // The line below attempts to fix the scale issue, but when included
    // it breaks the visualizations, and nothing renders.
    .y(d3.scale.linear().domain([1, 10]));

Когда я включаю код .y(d3.scale.linear().domain([1,10])), консоль выдает следующую ошибку: TypeError: rowChart.width(...).height(...) ... .y is not a function. Не знаю, что делать с ошибкой. Любая помощь приветствуется - заранее спасибо за чтение.


person kylerthecreator    schedule 19.05.2015    source источник


Ответы (1)


Ошибка заключается в том, что в диаграмме строк не используется шкала Y. Да, странно.

Что касается неправильного порядка, похоже, вы получаете лексикографический (строковый) порядок, а не числовой. Вы не показываете определение измерения, но я предполагаю, что ваш синтаксический анализатор csv или json возвращает строки, и вам нужно преобразовать их в числа.

Краткий, идиоматический способ сделать это с помощью +:

var ratingDim = ndx.dimension(function(d) { return +d.rating; });
person Gordon    schedule 19.05.2015
comment
Идеальный. Работает. Глупая ошибка с моей стороны. - person kylerthecreator; 20.05.2015
comment
Это случилось со всеми нами. Вероятно, хорошо иметь ТАК вопрос для этого. - person Gordon; 20.05.2015