JavaScript求两点之间相对于Y轴的顺时针旋转角度
需求: 已知一个向量,初始位置在y轴方向,如图红色箭头,绕中心点(x1, y1)旋转若干角度后,到达Line(x2,y2 x1,y1)的位置,求旋转角度

分析:
坐标点(x1, y1)(x2, y2)已知,则可利用JavaScript反三角函数求角度。
var getYAngle= function (cx, cy, x2, y2) {
var x = Math.abs(cx - x2);
var y = Math.abs(cy - y2);
var z = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
var tan = x / y;
var radina = Math.atan(tan);//用反三角函数求弧度
var angle = Math.floor(180 / (Math.PI / radina)) || 0;//将弧度转换成角度
if (x2 > cx && y2 > cy) {// point在第四象限
angle = (-1) * angle;
}
if (x2 == cx && y2 > cy) {// point在y轴负方向上
angle = 0;
}
if (x2 < cx && y2 > cy) {//point在第三象限
angle = angle;
}
if (x2 < cx && y2 == cy) {//point在x轴负方向
angle = 90;
}
if (x2 < cx && y2 < cy) {// point在第二象限
angle = 180 - angle;
}
if (x2 == cx && y2 < cy) {//point在y轴正方向上
angle = 180;
}
if (x2 > cx && y2 < cy) {//point在第一象限
angle = 180 + angle;
}
if (x2 > cx && y2 == cy) {//point在x轴正方向上
angle = -90;
}
return angle;
}
然后使用Svg.js修改polygon的属性
// headingPolygon
var Headingpolygon = SVG.get(this.config.panelId + '_Headingpolygon');
var xa = x1 - 7, xb = x1 + 7, ya = y1 + 18;
var headAngle = this.getYAngle(x1, y1, x2, y2) || 0;
Headingpolygon.attr({
'points': x1 + "," + y1 + " " + xa + "," + ya + " " + xb + "," + ya,
'transform': 'rotate(' + headAngle + ', ' + x1 + ' ' + y1 + ')'
});
本文参考: http://www.cnblogs.com/worldFulcrum/p/5573927.html
JavaScript求两点之间相对于Y轴的顺时针旋转角度的更多相关文章
- 求两点之间距离 C++
求两点之间距离(20 分) 定义一个Point类,有两个数据成员:x和y, 分别代表x坐标和y坐标,并有若干成员函数. 定义一个函数Distance(), 用于求两点之间的距离.输入格式: 输入有两行 ...
- 求两点之间最短路径-Dijkstra算法
Dijkstra算法 1.定义概览 Dijkstra(迪杰斯特拉)算法是典型的单源最短路径算法,用于计算一个节点到其他所有节点的最短路径.主要特点是以起始点为中心向外层层扩展,直到扩展到终点为止.D ...
- 武汉科技大学ACM :1006: 零起点学算法25——求两点之间的距离
Problem Description 输入平面坐标系中2点的坐标,输出它们之间的距离 Input 输入4个浮点数x1 y1 x2 y2,分别是点(x1,y1) (x2,y2)的坐标(多组数据) Ou ...
- HDU2874(LCA应用:求两点之间距离,图不连通)
Connections between cities Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (J ...
- UESTC(LCA应用:求两点之间的距离)
Journey Time Limit: 15000/3000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) Bob has ...
- URAL 题目1553. Caves and Tunnels(Link Cut Tree 改动点权,求两点之间最大)
1553. Caves and Tunnels Time limit: 3.0 second Memory limit: 64 MB After landing on Mars surface, sc ...
- JavaScript如何获得两点之间顺时针旋转的角度
接上回:如何用javascript中的canvas让图片自己旋转 既然能够制定角度让图片旋转,那么现在要做的是自动获得旋转的角度, 让图片能够随着鼠标的方向旋转,让人物能够面朝鼠标的方向: 源代码: ...
- dfs+记忆化搜索,求任意两点之间的最长路径
C.Coolest Ski Route 题意:n个点,m条边组成的有向图,求任意两点之间的最长路径 dfs记忆化搜索 #include<iostream> #include<stri ...
- Geotools求shapefile路网中任意两点之间最短路径的距离
前言:之前在博问求助过这个问题.经过几天的思考,算是解决了(但仍有不足),另一方面对Geotools不是很熟,有些描述可能不正确,希望大家批评指正. 问题:作为一个新手,我并没有发现Geotools中 ...
随机推荐
- 10年前文章_fedora10root登录
fedora10系统root用户登录以及普通用户使用sudo命令1.问题:fedora10默认不能够直接用root用户登录解决方法:我们可以先以普通用户登录$su#vi /etc/pam.d/gdm删 ...
- [lean scala]|How to create a SBT project with Intellij IDEA
this article show you how to create a SBT project with IDEA. prerequisite: 1.JDK8 2.Scala 2.11.8 3.I ...
- oracle删除数据文件
在我们详细介绍之前,我们必须说清楚一点:Oracle不提供如删除表.视图一样删除数据文件的方法,数据文件是表空间的一部分,所以不能“移走”表空间. 一.使用offline数据文件的方法 非归档模式使用 ...
- 双层for循环用java中的stream流来实现
//双重for循环for (int i = 0; i < fusRecomConfigDOList.size(); i++) { for (int j = 0; j < fusRecomC ...
- 使用logrotate轮询nginx和apache日志
使用logrotate轮询nginx和apache日志 文章目录 [隐藏] 配置nginx 配置apache 使用logrotate轮询日志很方便,配置也很简单. 配置nginx 1.建立/e ...
- 【LuoguP2792 】[JSOI2008]小店购物(最小树形图)
题目链接 题目描述 小店的优惠方案十分简单有趣: 一次消费过程中,如您在本店购买了精制油的话,您购买香皂时就可以享受2.00元/块的优惠价:如果您在本店购买了香皂的话,您购买可乐时就可以享受1.50元 ...
- React Native 中吐司组件react-native-easy-toast
https://github.com/crazycodeboy/react-native-easy-toast 用法: import Toast from 'react-native-easy-toa ...
- SQL SERVER 数据库如何限制一列不能重复(已经有主键)
ALTER TABLE 表名ADDCONSTRAINT 约束名 UNIQUE (列名) -------------------------------------------------------- ...
- 8:Spring Boot Shiro记住密码
1,添加Cookie 2,添加安全管理器中 3,配置记住我, 4 ,在登录页面中加我rememberMe复选框 /** * 1.配置Cookie对象 * 记住我的cookie:rememberMe * ...
- css3 clac()方法
calc()从字面上可以把它理解成为一个函数function,英文单词是calculate(计算),是CSS3的一个新功能,用来显示元素的长度. 他的用途就是,如果你有一个元素,加了padding或者 ...