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);
}