Как переместить позиции меток на динамический график d3 - PullRequest
Новая
       6

Как переместить позиции меток на динамический график d3

0 голосов
/ 27 апреля 2018

Мне удалось добавить метки из CSV-файла с кодом ниже, но текст из каждой строки CSV находится друг над другом, вы знаете, как переместить его, чтобы выглядеть лучше? 

  svg.selectAll(".labels")
              .data(data)
              .enter().append("text")
              .attr("transform", function(d) { return "translate(" + arc.centroid(d) + ")"; })
              .attr("dy", ".70em")
              .text(function(d) { return d.TrackName; })
              .attr("fill", function(d, i) { return color(i); });

1 Ответ

0 голосов
/ 27 апреля 2018

Когда вы выполняете объединение данных, вы можете получить доступ к datum, как вы уже продемонстрировали в своих attr функциях. Однако он также предоставляет index, который можно использовать в качестве второго параметра.

Измени свой 

.attr("dy", ".70em")

к чему-то еще, как это. Это умножает 0,7 на индекс каждого элемента, создавая их список. Возможно, вам придется настроить числа в зависимости от того, как это выглядит. 

.attr("dy", (d, i) => `${i * 0.7}em`);
...