Calcula ángulos y radianes

Símbolos y fórmulas

símbolo significado
α ángulo
rad radián
k pendiente
X La coordenada x del punto
y La coordenada y del punto
  1. La fórmula para la relación entre ángulos y radianes:α=(rad*180)/π
  2. pendiente en línea rectak=(y2-y1)/(x2-x1)
  3. tangentetan(α)=|k₁-k₂/(1+k₁k₂)|

función tangente inversa

Independientemente de calcular ángulos o radianes, la función tangente es siempre inseparable tanα
inserte la descripción de la imagen aquí
En funciones trigonométricas, tangentetanA = a / b= tanθ = y / x

Como typescriptejemplo, proporcione dos funciones de tangente inversa atan()y atan2()el valor en radianes utilizado para devolver el ángulo incluido, y luego obtenga el ángulo.

con el propósito atan2
entrando pendiente k coordenada y (longitud del lado opuesto) y coordenada x (longitud del lado adyacente)
rango (-π/2, π/2) (-π, π)
valor devuelto valor en radianes valor en radianes

Después de entender la fórmula y comparar las dos funciones tangentes inversas, podemos concluir:

  1. En la escena real, atan2está más en línea con la demanda y el cálculo es más conveniente
  2. Dos puntos determinan una línea recta. Por lo tanto, se determina de acuerdo con los dos puntos, x轴正方向夹角el valor en radianes de la línea recta y el ángulo, y luego se calcula el ángulo.
  3. El ángulo entre dos rectas. Podemos calcular sus valores en radianes por separado 交点的x轴正方向夹角, y luego restarlos.

combate

Cocos画圆弧: Tome tres puntos en la pantalla p1,p2,p3; p1como el centro del círculo, p1p2el p1p3más corto de , como el radio, p1p2y p1p3los dos lados del arco.

 dealArc() {
    
    
        if (this._points.length < 3) return;
        const ponits = this._points.slice(this._points.length - 3, this._points.length);
        //辅助线
        this.drawGuideLine(ponits[0], ponits[1]);
        this.drawGuideLine(ponits[0], ponits[2]);

        //第1个点到第2个点到距离为半径
        const r1 = ponits[0].sub(ponits[1]).mag();
        //第1个点到第3个点到距离为半径
        const r2 = ponits[0].sub(ponits[2]).mag();
        //选小的作为半径
        const r = r1 > r2 ? r2 : r1;
        const sAngle = LineUtils.getXRadian(ponits[0], ponits[1]);
        const eAngle = LineUtils.getXRadian(ponits[0], ponits[2]);
        CC_DEBUG && cc.log("GraphicsView " + sAngle + " " + eAngle);

        CC_DEBUG &&
            cc.log(
                "GraphicsView " +
                    LineUtils.getXAngle(ponits[0], ponits[1]) +
                    " " +
                    LineUtils.getXAngle(ponits[0], ponits[2])
            );
        this.drawArc(ponits[0], r, sAngle, eAngle, false);
    }

    drawArc(
        point: cc.Vec2,
        r: number,
        sAngle: number,
        eAngle: number,
        counterclockwise: boolean,
        lineWidth: number = this.lineWidth,
        lineClolor: cc.Color = this.lineClolor
    ) {
    
    
        this.graphics.lineWidth = lineWidth;
        this.graphics.strokeColor = lineClolor;

        this.graphics.arc(point.x, point.y, r, sAngle, eAngle, counterclockwise);
        this.graphics.stroke();
    }
export namespace LineUtils {
    
    
    //两个点计算与X轴正方向的夹角
    export function getXAngle(point1: cc.Vec2, point2: cc.Vec2) {
    
    
        //const k = Math.abs((point2.y - point1.y) / (point2.x - point1.x));
        const angle = (Math.atan2(point2.y - point1.y, point2.x - point1.x) * 180) / Math.PI;
        return angle > 0 ? angle : 360 + angle;
    }

    //两个点计算与X轴正方向的弧度
    export function getXRadian(point1: cc.Vec2, point2: cc.Vec2) {
    
    
        return (getXAngle(point1, point2) / 180) * Math.PI;
    }
}

inserte la descripción de la imagen aquí

referencia

https://blog.csdn.net/qq_43413788/article/details/108247240
https://www.jianshu.com/p/7c6a4f3021a1

Supongo que te gusta

Origin blog.csdn.net/DeMonliuhui/article/details/130009348
Recomendado
Clasificación