Porting Parallel Координаты код от d3.js v3.5.16 до 4.0

Question

У меня есть диаграмма параллельных координат, отображающая данные примера с d3.js версии 3.5, здесь вы можете увидеть код, запущенный в CodePen: codepen.io/gchriste/ pen/xEZjwz

Я хотел бы переписать код для работы с новейшей версией d3, версия 4.0. Кто-нибудь захочет просмотреть мою попытку сделать это? Я попытался реализовать изменения с 3.0 до 4.0, которые я читал здесь https://github.com/d3/d3/blob/master/CHANGES.md.

К сожалению, данные точки не втягиваются правильно, моя попытка порта можно увидеть здесь: codepen.io/gchriste/pen/rWBemp

Большое спасибо за ваше время.

Answer 1

Я развернул ручку и изменил несколько простых вещей. Вы в основном только ошибаетесь в своих масштабах - у всех проблемы с ними. Ординарные шкалы теперь немного сложнее, чтобы охватить больше случаев использования.

// X is a band scale 
var x = d3.scaleBand().range([0, w]); 

// ... 

// Your 'category Y' is a point scale 
y[d] = d3.scalePoint().domain(data.map(function(p) { 
    return p[d]; 
})).range([h, 0]); 

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

Forked CodePen

Answer 2

Я был на самом деле работает на том же, и у меня есть рабочая версия в v4 из параллельных координат графика (чистка и перемещение координат тоже работает). Код javascript находится в this question.