网站搜索

javascript - D3 lineRadial - 这背后的数学原理是什么?


我正在试着理解这段代码

    const radialScale = d3Scale.scaleLinear()
      .domain([0, 1])
      .range([0, this.radius]);

    const line = d3Shape.lineRadial()
      .angle((d) => {
        // Angle position
        return d[0];
      })
      .radius((d) => {
        // Distance from center
        return radialScale(d[1]);
      });

我打电话进去的

        console.log(d);
        const coors = line([[d.angle, d.radius]]).slice(1).slice(0, -1);
        console.log(coors);

具有那些值:

first log:
angle: 3.6215581978882336, radius: 14.3
second log:
-1122.510878774367,2156.323335456257

而且我无法理解函数的返回值。在我上面的规格中,它应该返回 d[0] —— 即 3.621....,但我却得到了 -1122.510878774367?我找到的关于 lineRadial 的文档说明它应该仅返回弧度值,而我的 d[0] 是一个弧度值。

https://www.geeksforgeeks.org/d3-js-lineradial-angle-method/

不确定我在这个函数上哪里出错了……

有什么想法吗?

答案#1

问题在于我搞错了radialScale函数,所以我的半径值超出了正常范围。我必须调整它,现在图表看起来很好。