D3 гистограмма из объектов с массивами

Question

Добрый день.

Я использую этот пример диаграммы D3 с моими данными (то есть в том же формате, что и в примере jsfiddle в ).

Диаграмма работает хорошо, но у меня есть некоторые проблемы, которые я не знаю, я решаю.

1. xAxis имеет номер индекса ключевого параметра, а не значения ключевых параметров;
2. Когда я сортирую данные после нажатия кнопки сортировки;
3. Числа над решеткой после рода исчезают или появляются на левой стороне InstEd более корреспондент баров

var dataset = {key: [0, 30], value:[60, 30]};

http://jsfiddle.net/3HL4a/75/

Вот ссылка, где вы можете увидеть код и выполнить изменения.

Благодаря

Answer 1

Для ссылки на ключевые значения, вы должны использовать их вместо индекса:

var xScale = d3.scale.ordinal() 
    .domain(dataset.key) 
    .rangeRoundBands([0, w], 0.05); 
// ... 
.attr("x", function(d, i) { 
    return xScale(dataset.key[i]); 
}) 

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

Что касается другой проблемы, это связано с тем, что вы выбираете элементы text, которые включают метки осей. Даже с ключевой функцией это здесь не работает, поскольку одна из меток оси совпадает с меткой, которую вы хотите отобразить на панели. Присвоение специального класса этим меткам и выбор соответственно исправляет это.

См. here для полного jsfiddle.