I have a Box2DWeb sketch working ok but I am unable to figure out how to use the ApplyForce method with a body. I have attached the working codepen. On line 85, I have commented out the line that I thought would work but everything disappears when I include it.
If anyone could let me know the correct way to use it, I would be very happy. I have RTFM and seen similar posts on StackO but I still cannot work it out.
http://codepen.io/anon/pen/vOJByN?editors=101
Thanks a lot,
Steven
// single dynamic object----------------------
var fixDef2 = new b2FixtureDef;
fixDef2.density = 1.0
fixDef2.friction = 0.2;
fixDef2.restitution = 0.5;
var bodyDef2 = new b2BodyDef;
bodyDef2.type = b2Body.b2_dynamicBody;
fixDef2.shape = new b2PolygonShape;
fixDef2.shape.SetAsBox((300/SCALE)/2, (60/SCALE) / 2);
bodyDef2.position.x = canvas.width/4/SCALE;
bodyDef2.position.y = canvas.height/2/SCALE;
bodyDef2.angle = 5;
world.CreateBody(bodyDef2).CreateFixture(fixDef2);
// Apply force to object----------------------
/*bodyDef2.ApplyForce(new b2Vec2(500,50) , bodyDef2.GetWorldCenter());
*/
You should call ApplyForce method of b2Body, not of b2BodyDef. You can get b2Body object as result of world.CreateBody(bodyDef2) method.
I've changed your codepen here: http://codepen.io/anon/pen/NqZvqG
Your code:
world.CreateBody(bodyDef2).CreateFixture(fixDef2);
// Apply force to object----------------------
/*bodyDef2.ApplyForce(new b2Vec2(500,50) , bodyDef2.GetWorldCenter());
*/
My code:
var myBody = world.CreateBody(bodyDef2);
var myFixture = mybody.CreateFixture(fixDef2);
// Apply force to object
myBody.ApplyForce(new b2Vec2(500,50), myBody.GetWorldCenter());
Related
i am new in cocos2d-js here, i just created this code:`
var that = this;
that._dice
// add player
// create sprite sheet
cc.spriteFrameCache.addSpriteFrames(res.dice_plist);
var spriteSheet = new cc.SpriteBatchNode(res.diceRed_png);
that.addChild(spriteSheet, 2);
// init runningAction
var animFrames = [];
for (var i = 1; i < 7; i++) {
var str = "dieRed" + i + ".png";
var frame = cc.spriteFrameCache.getSpriteFrame(str);
animFrames.push(frame);
}
var animation = new cc.Animation(animFrames, 0.1);
that.runningAction = new cc.Repeat.create(new cc.Animate(animation), Math.random()*10);
var diceSprite = new cc.Sprite("#dieRed1.png");
diceSprite.visible = true;
console.log(this.getContentSize(diceSprite));
diceSprite.runAction(this.runningAction);
that._dice.push(diceSprite);
var size = cc.winSize;
spriteSheet.setPosition(size.width/6.5, size.height/1.20);
spriteSheet.setAnchorPoint(0.5, 0.5);
spriteSheet.addChild(diceSprite, 2);
`
and i would like to use the getFrames() feature to return the array of ccanimation frames. i'm just thinking to get the information of which picture are being animated on the screen there, for example, if the #dieRed1.png is being animated or visible on the screen, it would show value or return value of 1. i have tried to googled around and cannot find any other clue there. if there is any better method, i would love to see that as well. sorry for the english anyway, a bit confused how to arrange the words. thank you :)
Ok, so refering to
the official docs
{Array} getFrames()
Returns the array of animation frames
Which means you can just do:
var frames = animation.getFrames();
To get the array. And then you'll receive an array of cc.AnimationFrame.
To get sprite link do:
var frame = frames[0];//cc.AnimationFrame
var spriteFrame = frame.getSpriteFrame(); //cc.SpriteFrame
var texture = spriteFrame.getTexture(); // cc.Texture
And the texture itself should have the name attribute which may do the job.
I'm newbie in cocos-js.
I want to make a health bar in cocos JS and try this code. And i choose to use Progress Timer. But when i use this code, it just show the bar, no running action. What's wrong ?
var healthBar = cc.ProgressTimer.create(cc.Sprite.create("health_bar1.png"));
healthBar.setType(cc.PROGRESS_TIMER_TYPE_BAR);
healthBar.setBarChangeRate(cc.p(1,0));
healthBar.setMidpoint(cc.p(0,0));
this.addChild(healthBar, 1);
healthBar.setPosition(cc.winSize.width/2, cc.winSize.height/2);
var to1 = cc.progressTo(5, 100);
healthBar.runAction(to1);
This code is working for me very well:
var healthBar = cc.ProgressTimer.create(cc.Sprite.create("health_bar1.png"));
healthBar.setType(cc.ProgressTimer.TYPE_BAR);
healthBar.setBarChangeRate(cc.p(1,0));
healthBar.setMidpoint(cc.p(0,0));
healthBar.setPosition(cc.winSize.width/2, cc.winSize.height/2);
this.getParent().addChild(healthBar, 1);
var to1 = cc.progressTo(5, 100);
healthBar.runAction(to1);
I have two collada files (two different scenes: "01.dae" and "02.dae").
I want to display 01.dae first and right after the animation finishes I want to load and display 02.dae on the same canvas.
(I'm trying to modify "webgl_loader_collada_keyframe.html" to do this but no results so far.)
How could I handle more than one animated collada scenes? A source code or any tips or tricks would be appreciated!
Thank you for your answer. I modified my code based on your idae but unfortunately it's not working.
Could you take a look at my code please?
Here is my code:
loader.load( 'pump.dae', function ( collada ) {
model = collada.scene;
animations = collada.animations;
kfAnimationsLength = animations.length;
model.scale.x = model.scale.y = model.scale.z = 0.125; // 1/8 scale, modeled in cm
init();
start();
animate( lastTimestamp );
setTimeout(loadSecond,3000);
} );
function loadSecond()
{
loader2.load( 'pump2.dae', function ( collada2 )
{
scene.remove( model );
model2 = collada2.scene;
animations2 = collada2.animations;
kfAnimationsLength2 = animations2.length;
model2.scale.x = model2.scale.y = model2.scale.z = 0.125; // 1/8 scale, modeled in cm
init2();
start2();
animate2( lastTimestamp2 );
//alert("second loaded");
} );
}
...
As you can see I extended your code with
scene.remove( model );
to remove the previous scene.
The first scene displays and then disapears properly however the new secene does not load. Do you have an idae why?
(Note: I don't know how long my first scene realy is.)
If you know how long the animation is, you could use a setTimeout to load the second model.
var loader = new THREE.ColladaLoader();
loader.options.convertUpAxis = true;
loader.load('PATH TO MODEL', function colladaReady( collada){
dae = collada.scene;
skin = collada.skins[ 0 ];
dae.scale.x = dae.scale.y = dae.scale.z = 1;
dae.updateMatrix();
scene.add(dae);
render();
setTimeout(loadSecond,3000);
});
function loadSecond(){
var loader = new THREE.ColladaLoader();
loader.options.convertUpAxis = true;
loader.load('PATH TO MODEL', function colladaReady( collada){
///repeat model loading logic
}
Where the time interval in the setTimeout is equal to the length of your animation.
i make a PieChart at run time, and i want to interpolate data change, but i have some difficult.
The Code is here:
//Pie Chart
pieChart.dataProvider = expenses;
var pieSeries:PieSeries = new PieSeries();
pieSeries.nameField = "position";
pieSeries.field = "value";
pieSeries.explodeRadius = 0.08;
pieChart.series = null;
pieChart.series.push(pieSeries);
I found two method, but i don't know how to use that >.<:
pieSeries.beginInterpolation
pieSeries.interpolate
1) First create a SeriesInterpolate class instance and customize it however you want.
2) You can set the showDataEffect style of your pieSeries object to the interpolate object that you just created.
Whalah.. whenever your data changes the interpolator will get triggered.
See the code snippet below..
I've also created an example application with source enabled.
goto: http://befreestudiosllc.com/demos/flex4/charting/seriesInterpolate/ and right-click to view source.
// Create an interpolator and customize its properties
var interpolateDataIn:SeriesInterpolate = new SeriesInterpolate();
interpolateDataIn.duration = 1000;
var pieSeries:PieSeries = new PieSeries();
pieSeries.setStyle("showDataEffect", interpolateDataIn); // apply interpolators to your series through show/hide dataEffects
I use AS3 in Flex 3 to create new image and seem unable to get the exact size of the original image. percentHeight & percentWidth to 100 can do the job, but limitation in ObjectHandlers require me to set the image scale in pixel.
Any solution?
Note: this is also applicable for displaying Image original dimension without ObjectHandler control, just remove those lines that are not applicable.
After struggle hours for solution, I found my own answer thru in actionscript forum, in fact, only one solution, I surprise there was no such topic elsewhere.
private function init():void {
var image:Image = new Image();
image.source = "http://www.colorjack.com/software/media/circle.png";
image.addEventListener(Event.COMPLETE, imageLoaded);
/* wait for completion as Image control is asynchronous,
* which mean ObjectHandler will attempt to load asap
* and you are not able to get the correct dimension for scaling.
* EventListener fixed that.
*/
this.addChild(image);
//whenever you scale ObjectHandler control, the image is always fit by 100%
image.percentHeight = 100;
image.percentWidth = 100;
}
private function imageLoaded(e:Event):void{
var img:Image = e.target as Image;
trace("Height ", img.contentHeight);
trace("Width ", img.contentWidth);
var oh:ObjectHandles = new ObjectHandles();
oh.x = 200;
oh.y = 200;
oh.height = img.contentHeight;
oh.width = img.contentWidth;
oh.allowRotate = true;
oh.autoBringForward = true;
oh.addChild(img);
genericExamples.addChild(oh);
}