カーンアカデミー：私はカーン・アカデミーでポリゴンを変換することができ、ライブラリをプログラミングしてい未定義

Question

のプロパティを読み取ることができません、しかし、私はこのエラーを取得しておく：行番号のない

Cannot read property 'x' of undefined 

。

マイコード：

var Point = function(x,y) { 
    this.x = x; 
    this.y = y; 
}; 

Point.prototype.rotate = function(around,degrees) { 
    angleMode = "degrees"; 
    var aX = around.x; 
    var aY = around.y; 
    var cX = this.x; 
    var cY = this.y; 
    var dist = sqrt(sq(cX-aX)+sq(cY-aY)); 
    var currentTheta = asin(dist/cY); 
    var gamma = degrees+currentTheta; 
    this.x = cos(gamma)*dist+aX; 
    this.y = sin(gamma)*dist+aY; 
}; 

var Line = function(x1,y1,x2,y2) { 
    this.f = new Point(x1,y1); 
    this.s = new Point(x2,y2); 
}; 

Line.prototype.draw = function() { 
    line(this.f.x,this.f.y,this.s.x,this.s.y); 
}; 

Line.prototype.rotate = function(around,degrees) { 
    this.f = this.f.rotate(around,degrees); 
    this.s = this.s.rotate(around,degrees); 
}; 

var Polygon = function(x,y){ 
    if(x.length!==y.length){return;} 
    this.sides = x.length; 
    this.x = x; 
    this.y = y; 
    this.lines = new Array(this.sides); 
    this.lines[0] = new Line(this.x[this.sides-1],this.y[this.sides-1],this.x[0],this.y[0]); 
    for(var i=1;i<this.sides;i++){ 
     this.lines[i] = new Line(this.x[i-1],this.y[i-1]); 
    } 
}; 

Polygon.prototype.draw = function() { 
    for(var i=0;i<this.sides;i++){ 
     this.lines[i].draw(); 
    } 
}; 

Polygon.prototype.rotate = function(around,degrees) { 
    for(var i=0;i<this.sides;i++){ 
     this.lines[i].rotate(around,degrees); 
    } 
}; 

var p = new Polygon([10,20,40],[40,20,15]); 

var draw = function() { 
    background(255,255,255); 
    fill(0,0,0); 
    stroke(0,0,0); 
    p.rotate(new Point(20,20),1); 
    p.draw(); 
}; 

それがエラーをスローし、なぜ私は、しかし、まだそれが誤りである場合には何の方向性を与えていない、特にので、わかりません。プロジェクトへ

EDIT

リンク： Transformation Library

Answer 1

あなたPointクラスとそのrotate()機能で始まるのをしてみましょう：

Point.prototype.rotate = function(around,degrees) { 
    angleMode = "degrees"; 
    var aX = around.x; 
    var aY = around.y; 
    var cX = this.x; 
    var cY = this.y; 
    var dist = sqrt(sq(cX-aX)+sq(cY-aY)); 
    var currentTheta = asin(dist/cY); 
    var gamma = degrees+currentTheta; 
    this.x = cos(gamma)*dist+aX; 
    this.y = sin(gamma)*dist+aY; 
}; 

この機能は、いくつかの数学を行い、this.xとthis.y変数を設定します。これまでのところとても良い（免責事項：私はこの数学をチェックしていませんが、それはポイントではありません）。しかし、この関数は何も返しません。

今度は、あなたのLineクラスとそのrotate()機能に行きましょう：

Line.prototype.rotate = function(around,degrees) { 
    this.f = this.f.rotate(around,degrees); 
    this.s = this.s.rotate(around,degrees); 
}; 

これはrotate()関数から返された値にfとs変数を設定します。しかし、Pointクラスのrotate()関数は何も返しません。だから今this.fとthis.sはは定義されていないです！

クラスのrotate()関数を呼び出すPolygonクラスにも同様の問題があります。

問題を解決するには、rotate()関数が何かを返すか、戻り値を期待する代わりに呼び出す必要があります。

一歩踏み込んで、あなたはなぜこのすべてを自分でやっているのだろうと思います。処理にはこのすべてを行う独自のrotate()関数があります。代わりにそれらを使うのはなぜですか？