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中 ...
随机推荐
- ERROR: Unable to clean up existing run directory
Project Navigator - Launching PlanAhead gives: ERROR: Unable to clean up existing run directory De ...
- 基于linux(CentOS7)数据库性能优化(Postgresql)
基于CentOS7数据库性能优化(Postgresql) 1. 磁盘 a) Barriers IO i. 通过查看linux是否加载libata,确定是否开 ...
- css实现div内凹角样式
平常的开发中我们一般使用到圆角都是外凸的,即border-radius属性.而如果有内凹角的情况,我们一般的考虑实现方法有2种.一种是直接使用背景图片,一种是使用css. 用到的属性则是backgro ...
- caffe与tensorflow中的pooling
两个框架对poolin的处理方式不同,这就导致在转模型时容易踩雷 tensorflow通过“VALID”和“SAME”参数来控制 caffe 通过pad值来控制 参考:https://blog.csd ...
- 强大的VS插件CodeRush发布v19.1.4|支持Visual Studio 2019
CodeRush是一个强大的Visual Studio .NET 插件,它利用整合技术,通过促进开发者和团队效率来提升开发者体验. [CodeRush for Visual Studio v19.1. ...
- java web中乱码的种类和一些解决方式
在java web课堂测试中遇到了一些乱码问题 ,从百度上找到了许多种解决方法和乱码的种类,在这里总结一下. 一.文件出现乱码 [右击文件]->[Properties]->[Resourc ...
- [洛谷P2886] 牛继电器Cow Relays
问题描述 For their physical fitness program, N (2 ≤ N ≤ 1,000,000) cows have decided to run a relay race ...
- 前端面试题常考&必考之--http中的post和get的区别
从字面上看,post是发送,则是提交数据,get是获得,则是获取数据,没毛病,我们可以就按字面来理解 具体就看图吧 吐槽:插入的表格不好用,不知道是自己不会用还是真不好用,变成了截图,修饰了下子
- luogu P1428 小鱼比可爱 x
P1428 小鱼比可爱 题目描述 人比人,气死人:鱼比鱼,难死鱼.小鱼最近参加了一个“比可爱”比赛,比的是每只鱼的可爱程度.参赛的鱼被从左到右排成一排,头都朝向左边,然后每只鱼会得到一个整数数值,表示 ...
- Spring Cloud教程(十二)加密和解密
Spring Cloud具有一个用于在本地解密属性值的Environment预处理器.它遵循与Config Server相同的规则,并通过encrypt.*具有相同的外部配置.因此,您可以使用{cip ...