2014-10-12 5 views
0

저는 자바 스크립트 게임 개발을 망설이고 배열로부터 스프라이트를로드하는 데 문제가 있습니다. 이 "mob"클래스를 개별적으로 업데이트하면 잘 작동하지만 for 루프를 사용하여 스프라이트를 추적하고 반복합니다. enter image description hereFor 루프로 배열의 스프라이트 업데이트

다음은 스프라이트 로더와 관련된 코드이며 스프라이트 자체의 코드입니다.

MobLoader

function mobloader(){ 
    var self = this; 
    for (c = 0; c < 3; c++){ 
     var t = new enemy(rInt(10, 400), rInt(10,400)); 
     enemies.push(t); 
    } 
    self.updatemobs = function(){ 
     for (l = 0; l < enemies.length; l++){ 
      enemies[l].updatemob(); 
     } 
    } 
} 

적 클래스 (잡초)

function enemy(x, y){ 
    var self = this; 
    self.x = x; 
    self.y = y; 
    self.name = "Jake"; 
    self.enemyspr = new sprite("grasstest.png", self.x, self.y, 40, 40, 1, 1, 0, false); 
    self.updatemob = function(){ 
     for (s = 0; s < spells.length; s++){ 
      if (spells[s].cy >= self.enemyspr.y && spells[s].cy <= self.enemyspr.y + self.enemyspr.h && spells[s].cx <= self.enemyspr.x + self.enemyspr.w && spells[s].cx >= self.enemyspr.x && self.enemyspr.active == true){ 
       self.enemyspr.active = false; 
       spells[s].spellspr.active = false; 
      } 
     } 
     self.enemyspr.update(); 
    } 
} 

기본 스프라이트 클래스

function sprite(src, x, y, w, h, f, l, a, loaded){ 
    var self = this; 
    self.src = src; 
    self.x = x; 
    self.y = y; 
    self.w = w; 
    self.h = h; 
    self.cf = 0; 
    self.f = f; 
    self.cl = 0; 
    self.l = l; 
    self.active = true; 
    self.a = a; 
    self.cfps = 0; 
    self.fps = 10; 
    self.loaded = loaded; 
    self.spr = new Image(); 
    self.spr.onload = function(){self.loaded = true;} 
    self.spr.src = self.src;  
    self.update = function(){ 
     if (self.active == true){ 
      self.cfps += 1; 
      if (self.cfps > self.fps && self.a == 1){ 
       self.cfps = 0; 
       self.cf += 1; 
       if (self.cf >= self.f){ 
        self.cf = 0; 
       } 
      } 
      if (self.a == 3){ 
       if (self.f > 9){ 
        self.cl = Math.floor(self.f/10); 
        self.cf = self.f - (Math.floor(self.f/10) * 10); 
       } 
       if (self.f <=9){ 
        self.cf = self.f; 
        self.cl = self.l; 
       } 
      } 
      ctx.drawImage(self.spr, self.w * self.cf, self.h * self.cl, self.w, self.h, self.x, self.y, self.w, self.h); 
     } 
    } 
} 
각 새로 고침

으로 캔버스를 지 웁니다

기본 클래스210

답변

0

프레임을 다시 그리기 전에 캔버스를 지워야합니다.

+0

이미 제가 생각하기에 문제는 엔티티를 업데이트하는 for 루프에서 오는 것이라고 생각합니다. – user1994100

+0

안녕하세요. ctx를 사용해 보셨습니까? ctx.fillRect 대신 .clearRect를 사용하여 캔버스를 지우시겠습니까? – d13

0

나는 위의 대답에 동의합니다. console.log에서 실행 중인지 확인하십시오. 작동하지 않는 경우 bgcolor를 "rgb"255,255,0 "으로 바꾸십시오. 테스트가 필요합니다. 뭔가 잘못되었을 수 있기 때문입니다. 엔티티를 업데이트 할 때마다 엔티티를 생성하고 있습니다. 그러나 매우 의심 스럽습니다.