2011-06-22 5 views
0

私は今、ちょっとした非営利プロジェクトのために働いていますが、私は今のところスクリプトがpng画像をピックアップしているのですが、どのようにこの画像を2つの異なるレイヤーに分割し、一度そのレイヤーをコンバスに読み込むかを操作しますか?PNGをレイヤーに分割する(HTML5、JS)

<html> 
<head> 
    <title>test</title> 
    <script type="text/javascript"> 
     function startup() { 
      var canvas = document.getElementById('canvas'); 
      var ctx = canvas.getContext('2d'); 
      var img = new Image(); 
      img.src = 'brushes.png'; 
      img.onload = function() { 
       ctx.translate(32, 120); 
       ctx.rotate(40 * Math.PI/180); 
       ctx.drawImage(img, -32, -120, 64, 120); 
      } 
     } 
    </script> 
</head> 
<body onload='startup();'> 
    <canvas id="canvas" style="position: absolute; left: 300px; top: 300px;" width="800" height="800"></canvas> 
</body> 

+2

PNGはレイヤーをサポートしていません。私はあなたの画像処理ソフトウェアのレイヤーを見ていると思います。しかし、その画像をPNGファイルとして保存すると、レイヤーはなくなり、単なる単純な画像になります。別々にイメージパーツにアクセスする場合は、イメージパーツを別のイメージパーツの下に置いてください。 –

答えて

5

限り、私はあなたがそれらを個別に操作するために、レイヤごとに一つの画像を保存する必要がありますので、PNGは、任意の層を持っていない知っています。

+0

ありがとう、イラストレーター広告でレイヤーを有効にするための余分なデータを忘れてしまった –

関連する問題