2개의 벡터가 이루는 각의 내적·외적의 수치의 변화를 확인
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.)
좋은 웹페이지 즐겨찾기
