html 5 canvas：改变多个单个矩形的颜色

我对一个项目很困难，我设定了自己。我一直在搞这个教程，这是一个瓦片交换器益智游戏。html 5 canvas：改变多个单个矩形的颜色

（http://hub.tutsplus.com/tutorials/create-an-html5-canvas-tile-swapping-puzzle--active-10747）

我想要做的是一个覆盖一块拼图用绿色透明色，当用户将其放置在正确的位置。

我知道它在正确的地方，我只是不知道如何改变只有一个单一的颜色。

代码

function resetPuzzleAndCheckWin(){ 

     _stage.clearRect(0,0,_puzzleWidth,_puzzleHeight); 
     var gameWin = true; 
     var i; 
     var piece; 
     for(i = 0;i < _pieces.length;i++){ 
      piece = _pieces[i]; 
      _stage.drawImage(_img, piece.sx, piece.sy, _pieceWidth, _pieceHeight, piece.xPos, piece.yPos, _pieceWidth, _pieceHeight); 
      _stage.strokeRect(piece.xPos, piece.yPos, _pieceWidth,_pieceHeight); 

      if (piece.xPos == piece.sx && piece.yPos == piece.sy){ 
       alert(1); 

       currentpiece = piece; 

       //_stage.strokeStyle = "#CC0000"; 

       //_stage.currentpiece.strokeStyle = "#CC0000"; 


      }

所以，如果你读了，发生了什么（从我的理解）是，一旦用户删除一个拼图，然后将坐标保存和变化，然后这个函数运行。该功能重新绘制所有拼图。

_pieces是对象

数组什么香港专业教育学院完成由if语句来检查是否有一块是在正确的位置。（作品）

我只是不知道如何更改只有正确的片段边框或颜色叠加。（行的事工）

我设法改变所有的作品边框颜色的......（见注释行）

来源

2013-10-12 Ghozt

只是在想，但我大概可以得出各地块另一个矩形？是的，可以工作，虐待测试！ – Ghozt

恩，似乎没有工作 – Ghozt

嗯，我似乎有什么工作。最让人兴奋的是，它在正确的位置绘制了一个带有我的边框的矩形，但没有绘制其余的矩形！ – Ghozt

DW的人，我已经悉数收入囊中了这一点。

这是我如何解决它：

基本上我justed添加一个矩形到正确的位置的图像，取得了边境BIG使对方矩形边框didnt名列在前。

然后，我不得不将_stage重置为所有其他矩形的法线。

这就是所有，继承人的代码：

if (piece.xPos == piece.sx && piece.yPos == piece.sy){ 
      // If correct piece 
       alert(1); 

       _stage.strokeRect(piece.xPos, piece.yPos, _pieceWidth,_pieceHeight) 
       _stage.strokeStyle = "red"; 
       _stage.lineWidth = 20;   

      } 

// for all the normal pieces... 

      _stage.drawImage(_img, piece.sx, piece.sy, _pieceWidth, _pieceHeight, piece.xPos, piece.yPos, _pieceWidth, _pieceHeight); 
      _stage.strokeRect(piece.xPos, piece.yPos, _pieceWidth,_pieceHeight); 
      _stage.strokeStyle = "black"; 
      _stage.lineWidth = 2;

来源

2013-10-12 12:57:46 Ghozt

html 5 canvas：改变多个单个矩形的颜色

回答

相关问题