2012-02-16 29 views
1

私はキャンバスとHTML5を使用しています。私は私のキャンバスにアイコンやテキストを持っていると私は、このコードで私のテキストに影を追加しようとしているとき:キャンバスにイメージを追加してイメージを追加する

ctx.shadowColor = textShadowColor; 
    ctx.shadowBlur = 1; 
    ctx.shadowOffsetX = 1; 
    ctx.shadowOffsetY = 1; 

影は私のイメージにもなります。何が問題なのか。私が見ているように、このshadowColorはキャンバス上にあり、実際にはテキスト上にはありません。テキストとイメージのキャンバスが違うのでしょうか?事前

答えて

2

おかげで、あなたは、最初のテキストや画像を描画していますか?

あなたが画像を描画している場合は、まず問題はないはずです。

http://jsfiddle.net/NAanu/

あなたが最初にテキストを描画している場合は、画像がで描画されませんので、影をクリアする必要がありますまた。ここで最初の影でテキストを描画する例です:私は、コンテキストからシャドウ状態を保存し、クリアするには、保存と復元を使用

http://jsfiddle.net/NAanu/1/

。あなたはそれらのすべてをデフォルト値に設定することができます。


あなたが塗料で絵筆をロードするようにそれを考える必要があるコンテキストにプロパティを設定します。

shadowColorのようなコンテキストプロパティを赤に設定すると、ペイントブラシの端に赤いペイントを読み込むような感じがします。あなたが次に描くものはどれも赤で表示されます。

ことを停止する唯一の方法は、そう後で私が思い出すことができる、(デフォルトに戻って色やshadowOffsetを設定)、または私の絵筆を一度明確だったことを覚えておいてください」と言っているsave()restore()を使用するように絵筆をきれいにすることです再度使用するこのクリアペイントブラシ "。

+0

ありがとうサイモン。私はすでにsave()を使用しています。 – novellino

関連する問題