三角学主要研究三角形和它们的边角关系,包含一个90度角的三角形被称为直角三角形。在这里主要研究直角三角形相关的知识。

   1. 角度和弧度

   360(角度) = 2*Math.PI(弧度) 

degrees = radians * 180/Math.PI
角度等于弧度乘于180再除于PI radians = degrees * Math.PI/180
弧度等于角度度乘于PI再除于180

    

   2. 三角形的边

   在一个直角三角形中,与90度角相邻的两条边称为直角边,与它对应的边称为斜边,斜边总是最长的边。

   

   3. 三角函数

    正弦:一个角的对边与斜边的比例。

   

   一个30度角的正弦值  

Math.sin(30 * Math.PI / 180)

   

   余弦:一个角的邻边与斜边的比例。

   

   一个30度角的余弦值

Math.cos(30 * Math.PI / 180)

   正切:一个角的对边与邻边的比例。

   一个30度角的正切值

Math.tan(30 * Math.PI / 180)

   反正弦:Math.asin(ratio)

   反余弦:Math.acos(ratio)   

   反正弦和反余弦是正弦和余弦的逆运算,输入一个比率,获得一个对应角的弧度。 

Math.sin(30 * Math.PI / 180) //约为0.5
Math.asin(0.5) * 180 / Math.PI //约为30度

   反正切:Math.atan(ratio)

   反正切通过一个角的对边与邻边比率得到角的弧度。

Math.tan(30 * Math.PI / 180) //约为0.578
Math.atan(0.578) * 180 / Math.PI //约为30度

    javascript中另一个反正切:Math.atan2(y,x)  

   

    javascript中坐标系统和平常的不一样。

    

   

     在javascript坐标系中通过反正切(Math.atan2)计算一个变化点对应一个固定点的角度:

    固定点(arrow.x, arrow.y )

    变化点(mouse.x, mouse.y)

var dx = mouse.x - arrow.x,
dy = mouse.y - arrow.y,
angle = Math.atan2(dy, dx);
console.log('角度为:' + angle );

   在javascript计算中,Math.atan2(y, x) 能正确的计算出对应角。

   4. 勾股定理

   直角三角形中,两条直角边的平方和等于斜边的平方。

   

   A的平方 + B的平方 = C的平方

   计算两点之间的距离

   点1:(x1, y1)

   点2:(x2, y2)

var dx = x2 - x1,
dy = y2 - y1,
dist = Math.sqrt(dx * dx + dy * dy);
console.log('距离为:' + dist);

javascript中的三角学的更多相关文章

  1. javascript中的Array对象 —— 数组的合并、转换、迭代、排序、堆栈

    Array 是javascript中经常用到的数据类型.javascript 的数组其他语言中数组的最大的区别是其每个数组项都可以保存任何类型的数据.本文主要讨论javascript中数组的声明.转换 ...

  2. javascript中的this与函数讲解

    前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...

  3. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  4. javascript中的操作符详解1

    好久没有写点什么了,根据博主的技术,仍然写一点javascript新手入门文章,接下来我们一起来探讨javascript的操作符. 一.前言 javascript中有许多操作符,但是许多初学者并不理解 ...

  5. 掌握javascript中的最基础数据结构-----数组

    这是一篇<数据结构与算法javascript描述>的读书笔记.主要梳理了关于数组的知识.部分内容及源码来自原作. 书中第一章介绍了如何配置javascript运行环境:javascript ...

  6. javascript中变量提升的理解

    网上找了两个经典的例子 var foo = 1; function bar() { if (!foo) { var foo = 10; } alert(foo); } bar(); // 10 var ...

  7. 前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型

    前端开发:面向对象与javascript中的面向对象实现(二)构造函数与原型 前言(题外话): 有人说拖延症是一个绝症,哎呀治不好了.先不说这是一个每个人都多多少少会有的,也不管它究竟对生活有多么大的 ...

  8. 简单分析JavaScript中的面向对象

    初学JavaScript的时候有人会认为JavaScript不是一门面向对象的语言,因为JS是没有类的概念的,但是这并不代表JavaScript没有对象的存在,而且JavaScript也提供了其它的方 ...

  9. Javascript中的valueOf与toString

    基本上,javascript中所有数据类型都拥有valueOf和toString这两个方法,null除外.它们俩解决javascript值运算与显示的问题,本文将详细介绍,有需要的朋友可以参考下. t ...

随机推荐

  1. ON、WHERE、HAVING的差别

    ON .WHERE.HAVING都能通过限制条件筛选数据,但他们的使用及其不同.以下我们来分析三者之间的差别. 1.       ON 和WHERE 全部的查询都回产生一个中间暂时报表,查询结果就是从 ...

  2. Burp Suite抓包、截包和改包

    Burp Suite..呵呵.. 听说Burp Suite是能够监測.截取.改动我们訪问web应用的数据包,这么牛X? 条件:本地网络使用代理.由Burp Suite来代理.也就是说,每一个流出外网的 ...

  3. 移动M站建设

    电商总结(五)移动M站建设   最近在一直在搞M站,也就是移动web站点.由于是第一次,也遇到了很多问题,所以把最近了解到的东西总结总结.聊一聊什么是移动M站,它有啥作用和优势. 也有人会问,M站和A ...

  4. Hermes和开源Solr、ElasticSearch 不同

    Hermes和开源Solr.ElasticSearch不同          谈到Hermes的索引技术.相信非常多同学都会想到Solr.ElasticSearch.Solr.ElasticSearc ...

  5. Unity MVC框架 StrangeIoC

    StrangeIoC是一个超轻量级和高度可扩展的控制反转(IoC)框架,专门为C#和Unity编写. 项目地址:https://github.com/strangeioc/strangeioc 文档地 ...

  6. (适合入门)JVM堆内存相关的启动参数:年轻一代、岁和永久代内存分配

    假设你要观察JVM进程消耗的堆内存,通过命令工具jmap或可视化工具jvisualvm.exe.JVM这些参数的默认启动值.假设你想知道JVM内存分配策略,最开始手动设置这些参数.通过JDK统计结果, ...

  7. Effective C++:条款28:避免返回 handles 指向对象内部成员

    (一) 有时候为了让一个对象尽量小,能够把数据放在另外一个辅助的struct中,然后再让一个类去指向它.看以下的代码: class Point { public: Point(int x, int y ...

  8. Python学习入门基础教程(learning Python)--3.2 if-else分支语句

    if-else分支语句结构的特点是当conditon条件满足时,执行if下的语句块,当condition条件不满足时执行else下的语句块,也就是说根据条件来控制让某些语句执行,某些语句不被执行. i ...

  9. poj3694(动态询问割桥的数目)

    给我们一个图,然后有q次加边的操作,问每次加完边之后有多少个桥存在 首先用dfs求出所有的桥,然后dfs的过程中生成了一棵dfs树,该树有的边是桥,有的不是,用bridge[v] = true , 表 ...

  10. Spring之AOP术语

    AOP是Aspect Oriented Programing的简称.被译为"面向切面编程". AOP独辟蹊径通过横向抽取机制为这类无法通过纵向继承体系进行抽象的反复性代码提供了解决 ...