js 计算获取鼠标相对某个点的移动旋转角度
// 旋转角度
function getAngle(cen, first, second) {
// cen : 中心点 [0,0]
// first : 开始点 [1,3]
// second : 结束位置 [3,4]
var f_c_x = first[0] - cen[0],
f_c_y = cen[1] - first[1],
s_c_x = second[0] - cen[0],
s_c_y = cen[1] - second[1];
var c = Math.sqrt(f_c_x * f_c_x + f_c_y * f_c_y) * Math.sqrt(s_c_x * s_c_x + s_c_y * s_c_y);
if (c == 0) return -1;
var angle = Math.acos((f_c_x * s_c_x + f_c_y * s_c_y) / c);
// 第一象限
if (cen[0] - second[0] < 0 && cen[1] - second[1] < 0) {
return angle
// 第二象限
} else if (cen[0] - second[0] < 0 && cen[1] - second[1] > 0) {
return angle
// 第三象限
} else if (cen[0] - second[0] > 0 && cen[1] - second[1] < 0) {
return 2 * Math.PI - angle
// 第四象限
} else if (cen[0] - second[0] > 0 && cen[1] - second[1] > 0) {
return 2 * Math.PI - angle
}
}
js 计算获取鼠标相对某个点的移动旋转角度的更多相关文章
- js如何获取鼠标位置
获取鼠标位置,首先需要加载js文件: 然后设置一个div,给定大小: 最后进行具体操作: //首先要先设置一个div,给定大小 <div id="m"></div ...
- js获取鼠标位置的各种方法
在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...
- 通过了解JS的clientX、pageX、screenX等方法来获取鼠标位置相对屏幕,相对浏览器窗口,相对文档的坐标详解
在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...
- js获取鼠标坐标位置兼容多个浏览器
这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...
- 原生js获取鼠标坐标方法全面讲解-zmq
原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...
- [js高手之路] html5 canvas动画教程 - 实时获取鼠标的当前坐标
有了前面的canvas基础之后,现在开始就精彩了,后面写的canvas教程都是属于综合应用,前面已经写了常用的canvas基础知识,参考链接如下: [js高手之路] html5 canvas系列教程 ...
- js 获取鼠标的手势方向角度
需要获取鼠标的移动角度 1.mousedown 确定起始点 2.mousemove 确立相关点 3.先计算两点的斜率,然后根据三角函数和反三角函数.转换为角度 <!DOCTYPE html> ...
- JS获取鼠标位置,兼容IE FF
由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...
- 原生js中获取this与鼠标对象以及vue中默认的鼠标对象参数
1.通过原生js获取this对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
随机推荐
- jQuery 小实例 关于按字母排序
jQuery的强大再次不再赘述 一般情况下操作表格式数据的一种最常见的任务就是排序,在一个大型的表格中,能够对要寻找的信息进行重新排列是非常重要的,一般情况用来完成排序的方式有两种 :一种是服务器端排 ...
- WEB下的excel批量导入功能
新手学习中,记录一下excel导出功能实现的整个流程.使用框架ssm. control层 importExcel+parseDataItem: @RequestMapping("import ...
- Beta测试团队
---恢复内容开始--- Beta版本测试 这个作业属于哪个课程 https://edu.cnblogs.com/campus/xnsy/SoftwareEngineeringClass1/?page ...
- 使用python划分数据集
无论是训练机器学习或是深度学习,第一步当然是先划分数据集啦,今天小白整理了一些划分数据集的方法,希望大佬们多多指教啊,嘻嘻~ 首先看一下数据集的样子,flower_data文件夹下有四个文件夹,每个文 ...
- CAD交互绘制直线(com接口)
用户可以在控件视区任意位置绘制直线. 主要用到函数说明: _DMxDrawX::DrawLine 绘制一个直线.详细说明如下: 参数 说明 DOUBLE dX1 直线的开始点x坐标 DOUBLE dY ...
- 微信小程序---账号注册与开发工具
(1)申请帐号 进入小程序注册页 根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号. 在这个小程序管理平台,你可以管理你的小程序的权限,查看数据报表,发布小程序等操作. 登录 小程序后台 ...
- Hibernate修改操作 删除操作 查询操作 增加操作 增删改查 Hibernate增删查改语句
我用的数据库是MySQL,实体类叫User public class User { private Integer uid; private String username; private Stri ...
- Conv1D和Conv2D的区别
我的答案是,在Conv2D输入通道为1的情况下,二者是没有区别或者说是可以相互转化的.首先,二者调用的最后的代码都是后端代码(以TensorFlow为例,在tensorflow_backend.py里 ...
- Centos7配置ThinkPHP5.0完整过程(一)
在Centos中配置PHP服务器环境,首先要安装Apache的http服务,然后安装php解析环境,最后再配置ThinkPHP5.0. 首先安装HTTP sudo yum install httpd ...
- Java中Date类型的工具类
package com.mytripod.util; import java.text.DateFormat; import java.text.SimpleDateFormat; import ja ...