HTML5技术

JavaScript: 使用 atan2 来绘制 箭头 和 曲线 - 救火队长

字号+ 作者:H5之家 来源:H5之家 2017-09-14 08:04 我要评论( )

在坐标系中理解 tan 和 atan 回顾一下三角函数 tan : tan tan 为何存在 atan2 ? 那么 atan2 又是怎么回事呢? 要知道这个,需要知道 arctan 的不足之处: arctan 它的计算过程是怎样的呢? 关于这个,我从 wikipedia 上摘取了它的计算过程: atan2 的应用 a

 

  •  

     

     

    在坐标系中理解tan atan

    回顾一下三角函数tan

    tan

     

    tan

     

    为何存在atan2 ?

    那么atan2又是怎么回事呢?

     

    要知道这个,需要知道arctan的不足之处:

    arctan

     

     

    它的计算过程是怎样的呢?

    关于这个,我从wikipedia上摘取了它的计算过程:

     

     

     

     

    atan2的应用

     

     

     

     

    atan2 

     

     如果两个点在第一象限内:

     

     

    如果两个点在第四象限内:

    如果两个点在不同的象限内,我们也可以平移来看。

     

     

    何时需要使用atan2 ?

     

    目前我遇到了两种情况,是通过atan2来解决的:

    1) 在平面坐标系内任意两个点间画一条带有箭头的直线(可以是单向箭头,可以是双向箭头)。在这个需求中,另外也知道了箭头的一条边与直线的夹角和箭头的长度。

    这个需求的难点就是要计算出箭头的另外两个点坐标。

    2) 

     

    这两个需求的共同特点是:

    1)两个已知的点

    2)根据这两个点和其他的条件去计算一些必须的(画line,arc等必须的)点坐标。

     

    目前我遇到了这两种需求,都通过atan2来解决的。其他的情况,目前尚且未知,待后续发现时,补充上。

     

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    • 利用HBuilder开发基于MUI的H5+ app中使用百度地图定位功能 - 程序媛鼓励师

      利用HBuilder开发基于MUI的H5+ app中使用百度地图定位功能 - 程序媛

      2017-09-13 09:00

    • FormData 对象的使用 - 蓓蕾心晴

      FormData 对象的使用 - 蓓蕾心晴

      2017-09-06 13:06

    • 【javascript】详解变量,值,类型和宿主对象 - 外婆的彭湖湾

      【javascript】详解变量,值,类型和宿主对象 - 外婆的彭湖湾

      2017-09-03 13:26

    • 【canvas学习笔记五】使用图片 - 池月

      【canvas学习笔记五】使用图片 - 池月

      2017-08-25 16:01

    网友点评