我想知道一个给定Angular 的椭圆上顶点的坐标. 椭圆中心在x=0和y=0上. 半长轴是x,值为1. 半短轴为y,其值为0.38. Angular 是可变的.

我在这个Stack Exchange帖子上try 了所有方法,但都不起作用:https://math.stackexchange.com/questions/22064/calculating-a-point-that-lies-on-an-ellipse-given-an-angle

错误的可能不是给定的解决方案,而是我将它们集成到JavaScript中.

例如,这不起作用:

a = 1
b = 0.38

function getAngle(x1, y1, x2, y2) {
    return Math.atan((y2 - y1) / (x2 - x1)) * 180 / Math.PI
}

angle = getAngle(0,0,0.3,0.7)

x = (a*b*Math.cos(angle))
/
Math.sqrt(
    (a*Math.cos(angle))**2 +
    (b*Math.sin(angle))**2
)

y = (a*b*Math.sin(angle))
/
Math.sqrt(
    (a*Math.cos(angle))**2 +
    (b*Math.sin(angle))**2
)

console.log({x,y})

输出:

{
    "x": -0.35112437558647797,
    "y": -0.3823646436315567
}

正如您在此图像上看到的,结果不是椭圆上的顶点:

enter image description here

我如何根据一个Angular 找到椭圆上一个点的坐标?

推荐答案

这样的椭圆只是一个圆,在y轴上按0.38倍的比例zoom .

我想用来理解答案的理由是逆转这种比例.

如果按系数1/0.38≈2.63zoom 整个图形y轴,则椭圆看起来将像一个圆. 但是,蓝线的Angular 就不同了.因为它的槽不是0.7/0.3,而是2.63×0.7/0.3.

这个Angular ,也就是那条蓝线和椭圆的交点的Angular .它是椭圆中交点的参数坐标.

由于参数坐标不依赖于比例,因此即使在当前0.38比例下它也保持不变

所以,结论是

let angle = Math.atan((0.7/0.3)*a/b);
let x = a*Math.cos(angle);
let y = b*Math.sin(angle);

演示:

let a=1;
let b=0.38;

let canvas=document.getElementById('canvas');
let ctx = canvas.getContext("2d");
let y0=120;
let x0=100;
let sc=150;
ctx.strokeStyle='#000000';
// Axis
ctx.beginPath(); 
ctx.moveTo(0,y0);
ctx.lineTo(300,y0);
ctx.stroke();
ctx.moveTo(x0,0);
ctx.lineTo(x0,300);
ctx.stroke();
// Ellipse
ctx.strokeStyle='#ff0000';
ctx.beginPath();
ctx.moveTo(x0+sc*a,y0);
ctx.ellipse(x0,y0,sc*a, sc*b, 0, 0, 6.28);
ctx.stroke();
// Blue line
ctx.strokeStyle='#0000ff';
ctx.beginPath();
ctx.moveTo(x0,y0);
ctx.lineTo(x0+0.3*sc, y0-0.7*sc);
ctx.stroke();

// Intersection coordinate. The next 3 lines are my answer
// (all the lines before, and after the next 3, are just 
// what is needed for drawing)
let angle = Math.atan((0.7/0.3)*a/b);
let x = a*Math.cos(angle);
let y = b*Math.sin(angle);

// Draw a yellow box at this point. It should intersect both ellipse and line
ctx.fillStyle='#888800';
ctx.beginPath();
ctx.fillRect(x0+x*sc-5, y0-y*sc-5, 10, 10);
<canvas id=canvas width=300 height=200>
</canvas>

现在,你可能会注意到,它并没有严格地回答你题目中的问题.它不会根据Angular 给出椭圆中点的坐标.因为angle不是蓝线的Angular ,而是它的Angular ,如果我们zoom 图表,使椭圆显示为一个圆.

但从问题的正文和代码来看,您真正的问题似乎是"根据直线斜率0.7/0.3在椭圆中寻找点".

但是如果你真的想从Angular (蓝线的Angular )找出这个点,你只需要用tan来得到斜率,然后zoom 并用atan来得到我们需要的真实Angular .

所以

let parametricAngle = Math.atan(Math.tan(inputAngle)*a/b);
let x=a*Math.cos(parametricAngle);
let y=b*Math.sin(parametricAngle);

Javascript相关问答推荐

ReactJS中的material UI自动完成类别

React Code不在装载上渲染数据,但在渲染上工作

如何从URL获取令牌?

Angular 订阅部分相互依赖并返回数组多个异步Http调用

当使用';字母而不是与';var#39;一起使用时,访问窗口为什么返回未定义的?

从页面到应用程序(NextJS):REST.STATUS不是一个函数

Puppeteer上每页的useProxy返回的不是函数/构造函数

使用NextJS+MongoDB+Prisma ORM获取无效请求正文,无法发布错误

为什么我的按钮没有从&q;1更改为&q;X&q;?

在不删除代码的情况下禁用Java弹出功能WordPress

如何防止ionic 输入中的特殊字符.?

如何使用抽屉屏幕及其子屏幕/组件的上下文?

如何通过Axios在GraphQL查询中发送数组

更改agGRID/Reaction中的单元格格式

找不到处于状态的联系人

Reaction路由v6.4+数据API:重试加载程序而不显示错误

我如何让我的弹力球在JavaScript和HTML画布中相互碰撞后改变 colored颜色 ?

我如何才能阻止我的球数以指数方式添加到我的HTML画布中?

在openstreemap/leaflet中,当鼠标在 map 上移动时,如何在小工具提示中实时显示坐标

在使用Jest进行测试时,在Express应用程序中未定义Multer