使用Crafty.js和Box2d绘制一个简单的圆圈

时间:2014-07-25 06:55:52

标签: javascript jquery box2d craftyjs

我正在尝试使用带有crafty.js的box2d绘制一个简单的圆圈,但我似乎无法绘制它 这是jsfiddle:http://jsfiddle.net/B5UsC/2/

看看这部分代码:

var ball = Crafty.e("2D, Canvas,Color, Box2D,ball")
                .attr({ x: 10, y: 15, z:5 })
                .color("#fff")
            .box2d({
                bodyType: 'dynamic',
                density: 1.0,
                friction: 2,
                restitution: 0.2,
                shape: 'circle'
            }).onContact("Floor",
                        function (data) { 
                        alert("Hi");
                        });

关于它的奇怪之处在于alert被执行但球未显示。我错过了一些请帮助

1 个答案:

答案 0 :(得分:3)

外部资源

<强> Box2dWeb-2.1.a.3.js

box2d.js

<强> crafty.js

这指向Unavailable Page,这就是为什么它在小提琴中不起作用


尝试下载来源CraftyJSBox2dwebBox2d

尝试看看它是否适合您。

好的,我的代码正常工作,似乎参考库crafty + box2d是由制作乒乓球游戏的用户制作的mod。

您忘记将宽度w和高度h属性放在球对象的.attr中。

        var ball = Crafty.e("2D, Canvas,Color, Box2D,Ball")
            .attr({ x: 10, y: 15, z:5 , w:25,h:25 })
            .color("#dddddd")
        .box2d({
            bodyType: 'dynamic',
            density: 1.0,
            friction: 2,
            restitution: 0.2,
            shape: 'circle'
        }).onContact("Floor",
                    function (data) { 
                    alert("Hi");
                    });

另一方面,如果你想要盒子轮廓吃圆圈 删除,color字符串参数中的文本Crafty.e并删除.color属性

        var ball = Crafty.e("2D, Canvas,ball, Box2D,")
            .attr({ x: 10, y: 15, z:5 , w:25,h:25 })

        .box2d({
            bodyType: 'dynamic',
            density: 1.0,
            friction: 2,
            restitution: 0.2,
            shape: 'circle'
        }).onContact("Floor",
                    function (data) { 
                    alert("Hi");
                    });

希望这会有所帮助:)