// 旋转角度
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 计算获取鼠标相对某个点的移动旋转角度的更多相关文章

  1. js如何获取鼠标位置

    获取鼠标位置,首先需要加载js文件: 然后设置一个div,给定大小: 最后进行具体操作: //首先要先设置一个div,给定大小 <div id="m"></div ...

  2. js获取鼠标位置的各种方法

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  3. 通过了解JS的clientX、pageX、screenX等方法来获取鼠标位置相对屏幕,相对浏览器窗口,相对文档的坐标详解

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  4. js获取鼠标坐标位置兼容多个浏览器

    这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...

  5. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  6. [js高手之路] html5 canvas动画教程 - 实时获取鼠标的当前坐标

    有了前面的canvas基础之后,现在开始就精彩了,后面写的canvas教程都是属于综合应用,前面已经写了常用的canvas基础知识,参考链接如下: [js高手之路] html5 canvas系列教程 ...

  7. js 获取鼠标的手势方向角度

    需要获取鼠标的移动角度 1.mousedown 确定起始点 2.mousemove 确立相关点 3.先计算两点的斜率,然后根据三角函数和反三角函数.转换为角度 <!DOCTYPE html> ...

  8. JS获取鼠标位置,兼容IE FF

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

  9. 原生js中获取this与鼠标对象以及vue中默认的鼠标对象参数

    1.通过原生js获取this对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

随机推荐

  1. 输入和输出(IO流)

    File类的常用方法: File对象的创建和部分方法使用: File file =new File("file\\我是文本.txt"); System.out.println(&q ...

  2. ssd遇到的bug

    从训练一开始就loss为0: 最开始以为是在生成train.lmdb前没有对label_map进行修改,发现并不是这个问题 1.训练的命令是:python ./examples/ssd/ssd_pas ...

  3. vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改

    vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...

  4. opencv读图片错误,已解决

    could not loag image... terminate called after throwing an instance of 'cv::Exception' what(): OpenC ...

  5. PHP 下基于 php-amqp 扩展的 RabbitMQ 简单用例 (五) -- 自动 ACK、手动 ACK、NACK

    以 Direct 类型的 交换机和 Queue 的 get 方法为例. producer.php // 连接设置 $conConfig = [ 'host' => '127.0.0.1', 'p ...

  6. HTML5 history API与ajax分页实例页面

    <ul id="choMenu" class="rel cho_menu"> <li><a href="ajax.php ...

  7. 21Spring重用切点表达式

    直接看代码: package com.cn.spring.aop.impl; //加减乘除的接口类 public interface ArithmeticCalculator { int add(in ...

  8. PHP:获取用户IP

    文章来源:http://www.cnblogs.com/hello-tl/p/7685263.html //获取用户ip(外网ip 服务器上可以获取用户外网Ip 本机ip地址只能获取127.0.0.1 ...

  9. stark组件之显示页面内容搭建(六)

    之前主要介绍了前端页面list_fiter功能的显示,但是list_display功能的展示并没有过多介绍,这里介绍一下是如何实现的. 可以看到凡是蓝线圈起来的都是通过字段名反射一个个取出来的,红线的 ...

  10. 集训第六周 数学概念与方法 概率 F题

    Submit Status Description Sometimes some mathematical results are hard to believe. One of the common ...