2개의 벡터가 이루는 각의 내적·외적의 수치의 변화를 확인

2개의 벡터가 이루는 각도가 0°에서 360° 사이에서 어떻게 수치로 변하는지를 확인하는 Dart 프로그램.

pubspec.yaml

name: dotcheck
dependencies:
    browser: any
    vector_math: any

index.html

<!DOCTYPE html>
<canvas id="canvas" width="500px" height="500px"></canvas>
<script type="application/dart" src="dotcheck.dart"></script>
<script src="packages/browser/dart.js"></script>

dotcrosscheck.dart

import 'dart:html';
import 'dart:math';
import 'package:vector_math/vector_math.dart';

CanvasElement canvas;
CanvasRenderingContext2D ctx;

num theta = 0;
num r = 100;

Vector2 origin = new Vector2.zero();
Vector2 to = new Vector2.zero();

main() {
  canvas = document.query('#canvas');
  ctx = canvas.getContext('2d');

  ctx.strokeStyle = 'black';

  window.requestAnimationFrame(update);
}

num lastTime;
update(num time) {
  num dt = lastTime != null ? (time - lastTime) / 1000 : 0;
  lastTime = time;

  window.requestAnimationFrame(update);

  render();

  theta += (PI / 4) * dt;
  if (theta > PI * 2) {
    theta %= PI * 2;
  }
}

render() {
  ctx
    ..resetTransform()
    ..clearRect(0, 0, canvas.width, canvas.height)
    ..translate(canvas.width / 2, canvas.height / 2)
    ..beginPath()
    ..moveTo(0, 0)
    ..lineTo(r, 0)
    ..moveTo(0, 0)
    ..lineTo(cos(theta) * r, sin(theta) * r)
    ..stroke();

  origin
    ..x = 1
    ..y = 0;
  to
    ..x = cos(theta)
    ..y = sin(theta);

  ctx
    ..fillText('angle: ${(theta * 180 / PI).toInt()}', 10, 10)
    ..fillText('dot: ${origin.dot(to)}', 10, 30)
    ..fillText('cross: ${origin.cross(to)}', 10, 50);
}

Reference

이 문제에 관하여(2개의 벡터가 이루는 각의 내적·외적의 수치의 변화를 확인), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/mozukichi/items/ecd133910a699844c873

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다