Javascript 从堆栈中删除画布矩形
我有以下代码:Javascript 从堆栈中删除画布矩形,javascript,html,html5-canvas,Javascript,Html,Html5 Canvas,我有以下代码: var stack = new Array(); var last = 0; var pospintar=0; function Cuadrado(pcolor,pcostat){ this.color=pcolor; this.costat=parseInt(pcostat); } function pintar(){ var canvas = document.getElementById('tutorial'); // Make sure we don't execut
var stack = new Array();
var last = 0;
var pospintar=0;
function Cuadrado(pcolor,pcostat){
this.color=pcolor;
this.costat=parseInt(pcostat);
}
function pintar(){
var canvas = document.getElementById('tutorial');
// Make sure we don't execute when canvas isn't supported
if (canvas.getContext){
// use getContext to use the canvas for drawing
var ctx = canvas.getContext('2d');
// Draw shapes
//ctx.fillStyle="#ff0000";
var vCuadro=stack[last];
ctx.fillStyle=vCuadro.color;
var lado=vCuadro.costat;
ctx.fillRect(20,pospintar,lado,lado);
//ctx.strokeRect(20,posPintar,lado,lado);
}
}
function empilar(color,costat)
{
var vCuadro = new Cuadrado(color,costat);
stack[last]=vCuadro;
pintar();
var vCuadro=stack[last];
var lado=vCuadro.costat;
pospintar+=lado;
last+=1;
}
function desempilar()
{
}
函数empilar绘制的矩形大小与变量costat相同
如何使相反的函数desempilar擦除最后绘制的矩形?在pintar函数中,您应该清除画布,遍历堆栈数组并绘制每个正方形。在desempilar函数中,您需要从堆栈中删除最后一个元素,并将最后一个变量减少1,然后再次调用pintar
function pintar() {
var canvas = document.getElementById('tutorial');
if (canvas.getContext) {
var ctx = canvas.getContext('2d');
ctx.clearRect(0,0,canvas.width,canvas.height); // Clear canvas
var pospintar = 0;
for (i in stack) {
var vCuadro=stack[i];
ctx.fillStyle=vCuadro.color;
var lado=vCuadro.costat;
var pospintar += lado;
ctx.fillRect(20,pospintar,lado,lado);
}
}
}
function desempilar() {
stack.splice(last, 1);
last--;
pintar();
}