标签: cocos2d-html5

这是我想要做的:http: //mbostock.github.com/d3/talk/20111116/iris-splom.html

但我想在webgl 2d中做到这一点(因为SVG性能非常慢,10k级SVG仅下降到12 fps)

在快速搜索中,我发现了几个webgl-2d库:cocos2d-html5,pixijs,Three.js和webgl-2d(废弃？)

它们似乎很简单,但我想做的是数据可视化.cocos和pixijs是2D游戏库.我是webgl和那些图书馆的新手,所以你们这些专家可以推荐吗？

我需要的东西总结:

互动:

• 图中的矩形选择.单击以选中某些元素.
• 变焦和平移支持(如果可能,闪烁变焦)

渲染器:WebGL2d(根据webgl的基准测试速度最快)

我是Cocos2D-HTML5(和HTML5本身)的新手,我试图让画布成为页面的完整大小.我对在互联网上记录的问题很少感到困惑,所以我希望它真的很简单.

问题是<canvas>元素不接受width="100%"或height="100%"只接受像素(但是它不会拉伸以适合窗口).

我也尝试了这里描述的解决方案(css以及javascript),但似乎Cocos2D调整画布大小以适应width和height属性,如果省略,使用默认大小300 x 150 px(没有Cocos2D我得到整页画布).

如何更改画布大小以适合Cocos2D本身的页面？

在我的简单项目中,我使用触摸事件来更改按钮状态:在这种情况下,一切正常

cc.eventManager.addListener(
{
    event: cc.EventListener.TOUCH_ALL_AT_ONCE,
    swallowTouches: false,
    onTouchesBegan: onTouchesBegan,
    onTouchesEnded: onTouchesEnded
}, this);

但是在这种情况下我的onTouchEnded函数从未被调用过:

cc.eventManager.addListener(
{
    event: cc.EventListener.TOUCH_ONE_BY_ONE,
    swallowTouches: false,
    onTouchBegan: onTouchBegan,
    onTouchEnded: onTouchEnded
}, this);

经过一段时间的调试后,我在cc.eventManager._onTouchEventCallback函数中找到了"if"语句:

} else if (listener._claimedTouches.length > 0
    && ((removedIdx = listener._claimedTouches.indexOf(selTouch)) != -1))
{

在我的情况下,"listener._claimedTouches"== 0并且if语句拒绝调用onTouchMove和onTouchEnded侦听器.

有没有人知道为什么"listener._claimedTouches"== 0以及为什么会发生这样的事情？

我有一个moveTo sprite动作,我试图在移动时让精灵有动画.这是一部动画片.

我的麻烦是我可以让精灵moveTo或动画,但不是两者都在一起,以便当精灵停止移动时,动画返回到站立框架.

我正在使用cocos2d-js v3.0

this.sprite = new cc.Sprite.create("#player-stand-f-0");
this.sprite.setPosition(new cc.Point(300,300));
this.addChild(this.sprite);

    var animFrames = [];
    var str = "";
    for (var i = 0; i < 5; i++) {
        str = "player-walk-f-" + i;
        var spriteFrame = cc.spriteFrameCache.getSpriteFrame(str);
       var animFrame = new cc.AnimationFrame();
        animFrame.initWithSpriteFrame(spriteFrame, 1, null);
        animFrames.push(spriteFrame);
    }

var animation = cc.Animation.create(animFrames, 0.025);
var animate   = cc.animate(animation);

sprite_action = cc.MoveTo.create(2,cc.p(x,y));
this.sprite.runAction(sprite_action);
this.sprite.runAction(animate);

我也试过以下但是步行会动画一次而不会继续直到moveTo停止.

var seq = cc.sequence(animate, sprite_action);