0
私は、htmlファイルにpaperscriptで単純な2つのボールシミュレーションを作成しようとしていました。 2つのボールは、期待どおりブラウザーウィンドウ内をアニメーション化して跳ね返ります。しかし、if文を挿入しようとすると、以下のコードでif(((xPos2-xPos1)** 2+(yPos2-yPos1)** 2)** 0.5 < = 100)アニメーションが消え、代わりにクロムコンソールに「予期しないトークン」エラーが表示されます。非常に基本的な衝突イベントをコードに挿入しようとしていますが、どこにも行きません。どのような問題が起こる可能性がありますか?シンプルなpaperscriptアニメーションで予期しないトークンエラー
<!DOCTYPE html>
<html>
<head>
<title>Ball Animation</title>
<link rel="stylesheet" type="text/css" href="ballAnimation.css">
<!-- Load the Paper.js library -->
<script type="text/javascript" src="paper-full.js"></script>
<!-- Define inlined PaperScript associate it with myCanvas -->
<script type="text/paperscript" canvas="myCanvas">
// }
var xPos1 = 100;
var yPos1 = 100;
var xPos2 = 100;
var yPos2 = 100;
var xInc1 = 10;
var yInc1 = 12;
var xInc2 = -10;
var yInc2 = 20;
var circle2 = new Path.Circle(new Point(100, 70), 50);
circle2.fillColor = 'purple';
var circle3 = new Path.Circle(new Point(250, 120), 50);
circle3.fillColor = 'yellow';
function onFrame(){
if(xPos1>=1000 || xPos1 <= 0){
xInc1 = (-1)*xInc1;
}
if(yPos1>=680 || yPos1<=0){
yInc1 = (-1)*yInc1;
}
xPos1 += xInc1;
yPos1 += yInc1;
if(xPos2>=1000 || xPos2 <= 0){
xInc2 = (-1)*xInc2;
}
if(yPos2>=680 || yPos2<=0){
yInc2 = (-1)*yInc2;
}
if(((xPos2-xPos1)**2+(yPos2-yPos1)**2)**0.5<=100) {
xInc1 = (-1)*xInc1;
yInc1 = (-1)*yInc1;
xInc2 = (-1)*xInc2;
yInc2 = (-1)*yInc2;
}
xPos2 += xInc2;
yPos2 += yInc2;
circle2.position += [xInc1,yInc1];
circle3.position += [xInc2,yInc2];
}
</script>
</head>
<body>
<canvas id="myCanvas" resize="true"></canvas>
</body>
</html>
ご協力いただきありがとうございます。 アンドリュー