2013-10-25 5 views
4

http://videobin.org/+70a/8wi.htmlСтолкновение с Бурундук JS неудачу

Вы можете увидеть, что там происходит, и демо попробовать его здесь: http://student.dei.uc.pt/~drgomes/carry/index.html.

Итак, я использую демоверсии Jip Jub, чтобы понять, как это работает (см. https://github.com/josephg/Chipmunk-js). Простая демонстрация начинается хорошо, но потом все начинает спрыгивать с ума, и я пытался выяснить это, пока не повезло.

var radToDeg = 180/Math.PI; 

function PlayState() { 
    this.blocks = []; 

    this.setup = function() { 
    space.iterations = 100; 
    space.gravity = new cp.Vect(0, 150); 
    space.game = this; 

    this.ground = space.addShape(new cp.SegmentShape(space.staticBody, new cp.v(0, 480), new cp.v(640, 480), 0)); 
    this.ground.setElasticity(0); 
    this.ground.setFriction(1); 
    }; 

    this.update = function() { 
    space.step(this.dt); 

    for (var i = 0; i < this.blocks.length; i++) { 
     var block = this.blocks[i]; 
     block.sprite.x = block.body.p.x; 
     block.sprite.y = block.body.p.y; 
     block.sprite.angle = block.body.a * radToDeg; 
    } 

    if (isMouseDown("left")) { 
     if (this.canAddBlock) { 
     this.canAddBlock = false; 
     this.addBlock(mouseX, mouseY); 
     } 
    } else { 
     this.canAddBlock = true; 
    } 
    }; 

    this.draw = function() { 
    clearCanvas(); 

    for (var i = 0; i < this.blocks.length; i++) { 
     this.blocks[i].sprite.draw(); 
    } 

    // this.ground.sprite.draw(); 
    }; 

    this.addBlock = function(x, y) { 
    width = 64; 
    height = 64; 

    var newBlock = new Block(x, y, width, height); 

    newBlock.body = space.addBody(new cp.Body(1, cp.momentForBox(1, width, height))); 
    newBlock.body.setPos(new cp.v(x, y)); 
    newBlock.shape = space.addShape(new cp.BoxShape(newBlock.body, width, height)); 
    newBlock.shape.setElasticity(0); 
    newBlock.shape.setFriction(1); 
    this.blocks.push(newBlock); 
    }; 
} 

desiredFPS = 60; 
switchState(new PlayState()); 

Исходный код довольно прост, у меня есть сомнения по поводу пути я создаю почву, так как я не могу сказать, в каком положении он на самом деле. Кубы, кажется, находят его и сталкиваются с ним, хотя.

Другой исходный файл немного класс Block, чтобы помочь мне организовать вещи:

Block = (function() { 
    function constructor(x, y, width, height) { 
    this.sprite = new Sprite("res/block.png", x, y); 

    this.width = width; 
    this.height = height; 

    } 

    constructor.prototype = { 
    update: function() { 

    } 
    }; 

    return constructor; 
})(); 
+0

Я бы включить холст инспектор инструментов chromes веб-разработчиков и посмотреть, что происходит: http://www.html5rocks.com/en/tutorials/canvas/inspection/ поскольку я боюсь, я не смог воспроизвести проблему. – silicakes

+0

Можете ли вы поместить свою демо в http://jsfiddle.net? –

+0

Где вы застряли? Мужчина, я не нашел здесь никаких проблем –

ответ

1

Наблюдая за поведением, я думаю, что это так просто, как спрайты и бурундуки тела не вращаются вокруг одной и той же точки. Я считаю, что вращения бурундуков находятся вокруг центра масс. Похоже, спрайты вращаются вокруг верхнего левого угла. На самом деле, они тоже могут рисовать из этого угла, что объясняет, почему они складываются смешно и пересекают нижнюю плоскость.

Я думаю, вам нужно что-то подобное в функции update. (Псевдокод):

offset = Vector(-width/2,-height/2) 
offset.rotate_by(block.body.a) 

block.sprite.x = block.body.p.x + offset.x 
block.sprite.y = block.body.p.y + offset.y 
+0

На самом деле, это отличная теория, я должен попробовать это, я уверен, что это может быть так. –

0

Я не знаю, бурундук на всех, но играя с демо-то кажется, что физики не прав на все (с самого начала для меня). Просто догадываюсь о вашем коде, но мне кажется, что вы должны устанавливать размеры на экземпляре Sprite в свой класс Block, а не на сам экземпляр Block.

Block = (function() { 
    function constructor(x, y, width, height) { 
    this.sprite = new Sprite("res/block.png", x, y); 

    // Do you mean to set the width and height of the sprite? 
    this.sprite.width = width; 
    this.sprite.height = height; 

    } 

    constructor.prototype = { 
    update: function() { 

    } 
    }; 

    return constructor; 
})();