Paper.jsキャッチコピー構文エラー

Paper.jsで多くの問題が発生しています。 UdmyのColt SteeleのWeb開発者用Bootcampをやっています。私はセクション19にあります。現在、Patatapクローンを作成しようとしています。ここで私がこだわってたときだ：はずの何Paper.jsキャッチコピー構文エラー

http://codepen.io/SlouchingToast/pen/LWLXYZ

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <title>Circles</title> 
    <link rel="stylesheet" type="text/css" href="circles.css"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/paper.js/0.10.3/paper-full.min.js"></script> 

    <script type="text/paperscript" canvas="myCanvas"> 

    function onKeyDown(event) { 
     var maxPoint = new Point(view.size.width, view.size.height); 
     var randomPoint = Point.random(); 
     var point = maxPoint * randomPoint; 
     new Path.Circle(point, 10).fillColor = "olive"; 
    } 

    var animatedCircle = new Path.Circle(new Point(300,300), 100); 
    animatedCircle.fillColor = "red"; 

    } 

    </script> 
</head> 
<body> 
    <canvas id="myCanvas" resize></canvas> 

</body> 
</html>

CSS

canvas { 
    width: 100%; 
    height: 100%; 
    background: black; 
} 

body, html { 
height: 100%; 
margin: 0; 
}

クロームコンソールエラー

Uncaught ReferenceError: animatedCircle is not defined 
    at at.paper._execute (<anonymous>:11:2) 
    at u (paper-full.min.js:38) 
    at HTMLCollection.l (paper-full.min.js:38) 
    at HTMLCollection.l (paper-full.min.js:32) 
    at Function.f [as each] (paper-full.min.js:32) 
    at f (paper-full.min.js:38) 
paper._execute @ VM519:11 
u @ paper-full.min.js:38 
l @ paper-full.min.js:38 
l @ paper-full.min.js:32 
f @ paper-full.min.js:32 
f @ paper-full.min.js:38

起こるには、円を表示するだけです。それでおしまい。

出典

2017-03-14 David

終了スクリプトタグの直前に余分な閉じ括弧があります。それは1つのエラーです。 – Brian

下記のpaperscriptを置き換えることで動作します。最初に不要な終了タグ}を削除します。第2に、animateCircle〜animatedCircleを修正してください。

<script type="text/paperscript" canvas="myCanvas"> 
    function onKeyDown(event) { 
     var maxPoint = new Point(view.size.width, view.size.height); 
     var randomPoint = Point.random(); 
     var point = maxPoint * randomPoint; 
     new Path.Circle(point, 10).fillColor = "olive"; 
    } 

    var animatedCircle = new Path.Circle(new Point(300,300), 100); 
    animatedCircle.fillColor = "red"; 
    </script>

出典

2017-03-20 09:15:15 sapics

Paper.jsキャッチコピー構文エラー

答えて

関連する問題