在<Canvas>上下文中更改顏色

Question

我剛剛開始使用Javascript和Canvas標記，並且有很多樂趣，直到我碰到這個障礙...基本上，我在畫布上繪製了三個不同的對象。大黑色矩形背面，然後兩個形狀矩形和文字。我希望它們是兩種不同的顏色，所以我在繪製每個顏色之前使用fillstyle（）。問題在於，瀏覽器似乎忽略了每次調用fillstyle（）後第一次使用我選擇的第一種顏色。我試過用beginPath（）和closePath（），fill（）語句，它似乎與這些工作或與這些，所以我不確定如果有需要我曾看到它在我研究這個問題時使用。我試過使用RGB值而不是顏色名稱。沒有運氣。

 //background 
    context.fillStyle = "Black"; 
    context.beginPath(); 
context.fillRect(0, 0, 500, 300); 
context.closePath(); 
context.fill();  

//text 
context.fillStyle = "Red"; 
    context.font = "20px Sans-Serif"; 
    context.textBaseline = "top"; 
    context.beginPath(); 
context.fillText ("TEXT", x, y); 
context.closePath(); 
context.fill();  

//Test block 
context.fillstyle = "Green"; 
context.beginPath(); 
context.fillRect(0,0,30,20); 
context.closePath(); 
context.fill(); 

Answer 1

它看起來就像你有一個錯誤你試塊：

context.fillstyle = "Green"; 

應該

context.fillStyle = "Green";