首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在阿基米德螺旋上求点的x,y坐标

在阿基米德螺旋上求点的x,y坐标
EN

Stack Overflow用户
提问于 2014-12-22 03:12:20
回答 2查看 3.2K关注 0票数 4

我试图用阿基米德螺旋作为轴,用D3.js绘制时间线上的数据。

所以我需要一个Javascript函数来传递它

  • D每一步的距离
  • of‘有许多步骤
  • X每个螺旋臂之间的距离

函数将遍历s*d的螺旋弧,并给出x和y笛卡儿坐标(图中的S点,s=10)。螺旋中心的第一点是0,0。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-12-22 22:24:07

谢谢你的帮助贝尔伍德。我试着绘制你的例子,但当我连续绘制5个点时,它变得有点奇怪(见底部的图像)。

我设法在下面的链接中找到了答案。但看起来你很亲密。

Algorithm to solve the points of a evenly-distributed / even-gaps spiral?

我的最后实现是基于上面的链接。

代码语言:javascript
运行
复制
function archimedeanSpiral(svg,data,circleMax,padding,steps) {
    var d = circleMax+padding;
    var arcAxis = [];
    var angle = 0;
    for(var i=0;i<steps;i++){
        var radius = Math.sqrt(i+1);
        angle += Math.asin(1/radius);//sin(angle) = opposite/hypothenuse => used asin to get angle
        var x = Math.cos(angle)*(radius*d);
        var y = Math.sin(angle)*(radius*d);
        arcAxis.push({"x":x,"y":y})
    }
    var lineFunction = d3.svg.line()
        .x(function(d) { return d.x; })
        .y(function(d) { return d.y; })
        .interpolate("cardinal");

    svg.append("path")
        .attr("d", lineFunction(arcAxis))
        .attr("stroke", "gray")
        .attr("stroke-width", 5)
        .attr("fill", "none");


    var circles = svg.selectAll("circle")
        .data(arcAxis)
        .enter()
        .append("circle")
        .attr("cx", function (d) { return d.x; })
        .attr("cy", function (d) { return d.y; })
        .attr("r", 10);

    return(arcAxis);
}

http://s14.postimg.org/90fgp41o1/spiralexample.jpg

票数 2
EN

Stack Overflow用户

发布于 2014-12-22 20:38:30

试一试没什么坏处:(请原谅我的新手javascript)

代码语言:javascript
运行
复制
function spiralPoint(dist, sep, step) {
    this.x = 0;
    this.y = 0;

    var r = dist;
    var b = sep / (2 * Math.PI);
    var phi = r / b;
    for(n = 0; n < step-1; ++n) {
        phi += dist / r;
        r = b * phi;
    }
    this.x = r * Math.cos(phi);
    this.y = r * Math.sin(phi);

    this.print = function() { 
        console.log(this.x + ', ' + this.y);
    };
}

new spiralPoint(1,1,10).print();
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/27596115

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档