2015-05-19 9 views
1

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

enter image description here

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

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

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. Не уверен, что делать с ошибкой. Любая помощь приветствуется - заблаговременно за чтение.

ответ

1

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

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

односложный, идиоматических способ сделать это с +:

var ratingDim = ndx.dimension(function(d) { return +d.rating; }); 
+0

Совершенная. Работает. Глупая ошибка с моей стороны. – kylerthecreator

+0

Это случилось со всеми нами. Наверное, хорошо, чтобы у него был вопрос. – Gordon

Смежные вопросы