当前位置:  开发笔记 > 编程语言 > 正文

D3找到线的角度

如何解决《D3找到线的角度》经验,为你挑选了1个好方法。

我有x1,y1,x2,y2,我该如何计算这条线的角度?

我必须使用纯数学吗?或者d3中有什么东西可以帮助我?

            edgeContainer.append("g")
                .selectAll("path")
                .data(edges)
                .enter()
                .append("path")
                .attr("class", function (d) {
                    return "nodeLine animate nodeLine_" + NodeUtils.createEdgeClass(d) + " node_" + d.outV + " node_" + d.inV;
                })
                .style("fill", "none")
                .style(edgeType == 'circular' ? "marker-start" : "marker-end", "url(#arrow)")
                .style("stroke", function (d) {
                    return options.edgeStroke ? options.edgeStroke : ReferenceData.getByRelationshipType(d.label).stroke;
                })
                .style("stroke-dasharray", function (d) {
                    return options.edgeStrokeDasharray ? (options.edgeStrokeDasharray == 'none' ? false : options.edgeStrokeDasharray) : ReferenceData.getByRelationshipType(d.label)['stroke-dasharray'];
                })
                .attr("d", function (d, i) {
                    var x1 = d.targetNode.node.x;
                    var y1 = d.targetNode.node.y;
                    var x2 = d.sourceNode.node.x;
                    var y2 = d.sourceNode.node.y;
                })

            ;

Ctx.. 6

角度的计算很容易:

 var angle = Math.atan2(y2 - y1, x2 - x1));

如果你需要度数,你可以通过乘以180/pi轻松转换它.

Math.atan2()方法返回-π和π之间的数值,表示(x,y)点的角度θ.这是在正X轴和点(x,y)之间以弧度为单位的逆时针角度.请注意,此函数的参数首先传递y坐标,然后传递x坐标.

在此输入图像描述

文档:developer.mozilla.org - Math.atan2()



1> Ctx..:

角度的计算很容易:

 var angle = Math.atan2(y2 - y1, x2 - x1));

如果你需要度数,你可以通过乘以180/pi轻松转换它.

Math.atan2()方法返回-π和π之间的数值,表示(x,y)点的角度θ.这是在正X轴和点(x,y)之间以弧度为单位的逆时针角度.请注意,此函数的参数首先传递y坐标,然后传递x坐标.

在此输入图像描述

文档:developer.mozilla.org - Math.atan2()

推荐阅读
路人甲
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有