Я пытаюсь адаптировать этот пример для своего сайта: https://bl.ocks.org/dimitardanailov/bb12fef05c5ed56e793728ed8e84bb81
, потому что мне это не удалось, я построчно скопировал Код. Разница лишь в том, что я работаю с d3.js-v4.
Я не получаю этот код работающим.
Переменные data и endPointsData заполнены правильно, но в SVG вставляются только пять пустых тегов строки <line></line>
Как я понял, .enter().append('line').attr(lineAttributes) должен добавить несуществующие строки в SVG,вызывающая строка Атрибуты для каждого элемента данных.
Может кто-нибудь объяснить, как это должно работать, если я ошибаюсь?
Что еще я могу сделать для отладки кода?
РЕДАКТИРОВАТЬ:
еслиЯ создаю линии следующим образом:
var lines = svg
.selectAll('line')
.data(data)
.enter()
.append('line')
.attr('x1', function (d) { return d.x1 })
.attr('y1', function (d) { return d.y1 })
.attr('x2', function (d) { return d.x2 })
.attr('y2', function (d) { return d.y2 });
Вместо вызова lineAttributes, линии нарисованы. Так что может быть причиной того, что атрибуты lineAttributes не работают?
Кстати: то же самое с кругами