2011-10-21 13 views
1

これはhtml5の質問よりjqueryの質問のほうが多いですが、それほど良い例はありません。jqueryを使用した2dキャンバス

<html> 
    <head> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       context = $("#mainCanvas")[0].getContext("2d"); 
       alert(context); 

       context.fillStyle = "rgb(200,0,0)"; 
       context.fillRect (10, 10, 55, 50); 

       context.fillStyle = "rgba(0, 0, 200, 0.5)"; 
       context.fillRect (30, 30, 55, 50); 
      }); 
     </script> 
    </head> 
    <body> 
     <canvas id="mainCanvas" width="800" height="600"> 
     </canvas> 
    </body> 
</html> 

そうのようなキャンバスオブジェクトに「のgetContext」機能を呼び出すために、私はjQueryオブジェクトへのインデックスを持っている:オブジェクトへのインデックスに必要

$("#mainCanvas")[0].getContext("2d") 

は不格好で直感的ではありません。私の質問は、は、jqueryの "欠落した"関数が自動的にラップされたオブジェクト内に含まれることをjQueryが推論する方法はないのですか?私が紛失しているjquery構文のトリックはありますか?

ありがとうございました。

答えて

4

私が気付いている欠けているJavascriptメソッドへの呼び出しをオーバーライドする方法はありません。私が最近取り組んできた問題のようなものを実際に使うことができるので、残念です。あなたができる最善のはそうのような関数のラッパーのいくつかの並べ替え、次のとおりです。

callFunction(obj, "methodName", [args], function() { /*fallback*/ }); 

しかし、それはひどくきれいではないと性能がより少なくより良いだろう。 shrug

あなたのケースでは、これは本当にすべて悪いですか? 1つのコールを作成し、残りのすべてのコールについてグラフィックスコンテキストをキャッシングするだけです。

var ctx = document.getElementById("mainCanvas").getContext("2d"); 

あなたがそのようなことを心配している場合にも、より速くsmidgeになるだろう:index構文は本当にあなたにすべてのこと攻撃的である場合には、この呼び出しのためのjQueryのレスを行くこともクリーナーオプションです。実際、jQueryは、キャンバスの操作についてはほとんど何も提供していません。

+0

ありがとうございました:)うん、jqueryはキャンバス要素でぐちゃぐちゃを買っていませんが、今はjqueryで考えています。いつも私が "getelementby ..."と似たものを見ると、私の脳は "NO!ドル記号!ドル記号!!! $$$$"と言います。私はこれが哲学的議論のほうにあると考えました。 – feathj

関連する問題