HOME > > js三角関数

js

js三角関数

Math.cos()やMath.acos()に渡す値の単位はラジアン
ラジアン 180°=π[rad]

ラジアン = (角度 * Π) / 180
ラジアン = (角度 * Math.PI) /180

console.log(Math.PI);
console.log(Math.cos((90 * Math.PI) / 180));   //cos90度
console.log(Math.sin((30 * Math.PI) / 180));   //sign30度
console.log(Math.tan((45 * Math.PI) / 180));  //tan45度
console.log(Math.acos(1)); //アークコサイン1→0
console.log(Math.asin(1)); //アークサイン1→1.570...
console.log(Math.atan(1));  //アークタンジェント1→0.785...
console.log((Math.atan2(1,1) * 180)  / Math.PI ) ;   //(1,1)がなす角度 45度

画像回転

.kaiten {
position:relative;
z-index:10;
width:200px;
height:200px;
}
const character = document.querySelector('.kaiten');
let degree = 0;
loop();

function loop() {
const rotation = (degree * Math.PI) / 180;
const targetX = window.innerWidth / 5 + 100 * Math.cos(rotation);
const targetY = window.innerHeight / 40 + 100 * Math.sin(rotation);
character.style.left = `${targetX}px`;
character.style.top = `${targetY}px`;
degree += 1;
requestAnimationFrame(loop);      //関数の中に入れると繰り返し実行
}

このページのTOPへ