js获取屏幕上圆和椭圆的点坐标

简介: js获取屏幕上圆和椭圆的点坐标

画一个圆


/**
 * 获取圆形
 */
const getCircular = (center: number[], radius: number) => {
    const num = 360 // 点越多,圆越圆
    //待计算圆上的点 注意:半径越大需要计算的点数量越多 本示例使用360个点
    const pointArr = []
    for (let i = 0; i < num; i++) {
        //角度转弧度
        const radians = (i * (360 / num) * Math.PI) / 180
        //计算圆上的点X坐标
        const x1 = center[0] + radius * Math.cos(radians)
        //计算圆上的点Y坐标
        const y1 = center[1] + radius * Math.sin(radians)
        //赋值圆上所有点数组
        pointArr.push([x1, y1, center[2]])
    }
    return pointArr
}


效果


aafd9a87cd814ab8bb6d4f58b7a4fbd4.png


画一个椭圆


function getCPoint ( center:number[], a:number, b, p = 1, ) {
      const data = []
      for (let index = 0; index < 360; index = index + p) {
        let x = a * Math.cos(Math.PI * 2 * index / 360)
        let y = b * Math.sin(Math.PI * 2 * index / 360)
        data.push([x + center[0], y + center[1], center[2]])
      }
      return data
    }


效果


d0f1795e0a854ea28026015d40c6445d.png

相关文章
|
JavaScript API
JS如何模拟鼠标点击X,Y坐标
现在我有个窗口坐标X,Y. 如何利用JS点击该坐标? document.body.onclick = function(){ e = arguments[0]; var dt = e.
2338 0
|
9月前
|
JavaScript 前端开发
[Javascript] 检测屏幕滑动方向
要使用 JavaScript 检测屏幕滑动方向,可以监听滚动事件 (scroll) 并与前一个滚动位置进行比较来确定滑动的方向。
|
5月前
|
JavaScript
js获取元素相对于document的坐标
js获取元素相对于document的坐标
29 0
|
8月前
|
JavaScript
JS,Jquery获取各种屏幕的宽度和高度
JS,Jquery获取各种屏幕的宽度和高度
|
11月前
|
JavaScript 前端开发
获取屏幕、窗口和网页尺寸, 用JavaScript
本教程介绍了如何使用JavaScript获取屏幕、窗口和网页的尺寸。通过对不同尺寸的定义和访问方法进行解释,帮助读者更好地理解各种尺寸的含义和用途。
243 0
|
JavaScript
js:事件对象中的7种坐标
js:事件对象中的7种坐标
|
JavaScript 前端开发
js获取元素到文档区域document的(横向、纵向)坐标的两种方法
js获取元素到文档区域document的(横向、纵向)坐标的两种方法
js获取元素到文档区域document的(横向、纵向)坐标的两种方法
|
前端开发 JavaScript
《JS原理、方法与实践》- canvas作图(六)- 坐标操作
《JS原理、方法与实践》- canvas作图(六)- 坐标操作
93 0
|
前端开发 算法 JavaScript
《JS原理、方法与实践》- canvas作图(二)- 组合、剪切、坐标检测
《JS原理、方法与实践》- canvas作图(二)- 组合、剪切、坐标检测
156 0