D3 lineRadial не показывает, в то время как другие элементы показывают - PullRequest
Новая
       39

D3 lineRadial не показывает, в то время как другие элементы показывают

0 голосов
/ 29 марта 2020

У меня есть следующая «стрелка часов», реализованная как lineRadial. Тем не менее, это не показывает. Почему бы нет? 

const line = d3.select("svg")
    .append("lineRadial")
    .attr("angle", -Math.PI / 2)
    .attr("radius", 60)
    .attr("stroke", "red")
    .attr("stroke-width", "2")
    .attr("transform", "translate(60,60)");

Я не понимаю, у меня есть другие элементы в SVG, которые работают нормально. Еще одна строка (показанная ниже), которая работает найти. Любое объяснение? Есть ли разница? 

const line = d3.select("svg")
    .append("line")
    .attr("x1", 0).attr("y1", 0).attr("x2", 0).attr("y2", -60)
    .attr("stroke", "red")
    .attr("stroke-width", "2");

1 Ответ

1 голос
/ 29 марта 2020

lineRadial не является допустимым компонентом svg, вы должны сказать line (как и во втором фрагменте кода, angle также не является допустимым атрибутом line, вы должны сказать что-то вроде: 

.attr("transform", "rotate(90)")

Я бы порекомендовал прочитать do c для поворота, поскольку он принимает 3 параметра. Вот объяснение: The rotate(<a> [<x> <y>]) transform function specifies a rotation by a degrees about a given point. If optional parameters x and y are not supplied, the rotation is about the origin of the current user coordinate system. If optional parameters x and y are supplied, the rotate is about the point (x, y). из https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform

Наконец Обратите внимание, что угол должен быть указан в градусах.

...