2012-03-30 8 views
0

キャンバスにイメージを描画し、スプライトのようにイメージをアニメーションしたいと思います。私はCoffeescriptを使用してイメージを表示するのに問題があります。私はこの投稿のために私のクラスを短縮しました。うまくいけば私はエラーを導入しなかった。キャンバスdrawImage with Coffeescript

class TripleSlider 
    @imageMin = new Image() 

    constructor: (@context, @x, @y, @tsLabel, @showLimits=false) -> 

    $(TripleSlider.imageMin).onload = -> 
    @context.drawImage(TripleSlider.imageMin, @x+50, @y+50) 

    TripleSlider.imageMin.src = "/images/sliderTipMin.png" 

私はまた、このようなonloadイベントハンドラを書いてみました:私はonloadイベントハンドラの構文は何とか間違っている疑いがある

TripleSlider.imageMin.onload = -> 
    @context.drawImage(TripleSlider.imageMin, @x+50, @y+50) 
  1. を。私が見つけた例のほとんどは、必要以上に複雑であり、Coffescriptのドキュメントは想像力に多大な影響を与えています。
  2. イメージの位置を変更するにはどうすればよいですか?

マイク

答えて

1

@、またはthisは、あなたのonloadハンドラ内のあなたのTripleSliderインスタンスではありませんので、@contextはおそらく定義されることはありません。これは、javascriptのスコープthisのためです。

$(TripleSlider.imageMin).onload = => 
    @context.drawImage(TripleSlider.imageMin, @x+50, @y+50) 
+0

は私がすることを試みたが、無喜び:CoffeeScriptのは、まさにこのために、 "fat arrow"、=>を提供します。おそらく別の問題もあるでしょう。これも機能しませんでした。$(TripleSlider.imageDef).load(event)=> @ context.drawImage(TripleSlider.imageDef、@ x + 63、@sliderTrackBottom()) –

関連する問題