Search the Community

Showing results for tags 'world'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 58 results

  1. KiloGram

    Setting World Bounds

    Is there a way (I'm sure there is) of expanding the world bounds and setting their coordinates and width and height properties? Otherwise the bounds stay the size of the view-port and I need them bigger. Thanks in advance.
  2. hundo.chester

    player bounds change

    Hello, i have this script which is based on the tutorial: i want the player to navigate through the world, but it's constrained to a 800x600 box, (as this is the world WxH), the "game" world is a GIF 4096x3500. maybe this is not the correct way, could you please lead me into the correct way? this is the code: http://cypunkdb.net/t/phaser/tut1b/part7.html thanks
  3. tomfog

    Move world position on canvas

    Hi I have a newbie question that I feel silly asking but I couldn't find an example that demonstrated this yet. I have set the size of the canvas using the following code: var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'new-phaser-game', { preload: preload, create: create, update: update, render: render }); I have added a sprite that sits at the bottom of the screen full width (as expected) using the following: shapeMenu = game.add.sprite(0, 500, 'shapeMenu'); Now I would like to resize the world so that it sits inside this area with a margin around it (but inside the canvas). I have done this, but the world is sitting in the top left corner: game.world.setBounds(0, 0, 400, 400); Could any one advise on how I move this to the center of the screen (without moving the shapeMenu sprite as well)? Thanks!
  4. Hi, I am trying to modify the 'Pick Up Object' phaser example: https://phaser.io/examples/v2/p2-physics/pick-up-object How it should work is that when a user clicks on one of the shapes at the bottom of the screen it should generate a new shape inside the yellow containing block. I want the shapes to restricted inside the yellow box so that they cannot pass outside. Here is my demo version: http://towerofconfidence.stage.pixeledeggs.com/test/index4.html I have tried the following code - but I am not sure what is going wrong with the boundaries - any help/suggestions would be much appreciated! var game = new Phaser.Game(640, 1139, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); // set the world bounds to match the yellow container game.world.setBounds(167, 0, 306, 500); // center camera game.camera.bounds.setTo(0, 0, 640, 1139); // load the background - this is larger than the screen var mainBG = game.add.sprite(0, -3622, 'mainBG'); // add shapes/buttons to the shapeMenu button1 = game.add.button(80, 760, 'button1', actionOnClickButton, this, 2, 1, 0); button2 = game.add.button(254, 800, 'button2', actionOnClickButton, this, 2, 1, 0); button3 = game.add.button(486, 770, 'button3', actionOnClickButton, this, 2, 1, 0); Then the logic for placing the shapes follows the 'Pick Up Object' example - using PS physics ands boundsCollisionGroup... Thanks!
  5. SamSnowy

    'Sprite.world' gives 0 at first

    So my problem is that I have a sprite that is giving me 0 for sprite.world.x and sprite.world.y (although it clearly isn't at 0,0). What's weird is that printing out the sprite.world.x gives 0 at first but adding a delay of 50ms it gives me the correct position (in case you're wondering nothing is happening during the delay) Below is the code snippet that i am using (just to be 100% sure). Basically I have a group (located at a certain position) with a specific rotation that has a sprite (the one I'm having issues with) at a certain location. The first printed out value is 300 (which obviously isn't true). I added a delay of 50 ms after the last line then printed out newR.world.x and got the correct value (813). The provided code snippet is the last thing I have in my create function (and the update function is empty). As stated previously nothing is happening by the time the delay starts till it ends (I am only left with the preload function).
  6. SamSnowy

    'Sprite.world' gives 0 at first

    So my problem is that I have a sprite that is giving me 0 for sprite.world.x and sprite.world.y (although it clearly isn't at 0,0). What's weird is that printing out the sprite.world.x gives 0 at first but adding a delay of 50ms it gives me the correct position (in case you're wondering nothing is happening during the delay) Below is the code snippet that i am using (just to be 100% sure). Basically I have a group (located at a certain position) with a specific rotation that has a sprite (the one I'm having issues with) at a certain location. The first printed out value is 300 (which obviously isn't true). I added a delay of 50 ms after the last line then printed out newR.world.x and got the correct value (813). The provided code snippet is the last thing I have in my create function (and the update function is empty). As stated previously nothing is happening by the time the delay starts till it ends (I am only left with the preload function). Note: I accidentally posted my question twice please ignore the duplicate. ( I couldn't find a delete button for my duplicate post)
  7. Hi all, Hopefully, this is just something quick I'm missing... I have initialized my game with the resolution of 500x800 and SCALE_MODE is set to RESIZE; In portrait orientation, the game is the correct size of 500x800, however, when I rotate the device and would expect the game to now be 800x500 it is actually 500x313. I'm thinking I'm just missing something that I need to manually resize or update or something, but I'm having trouble finding what I need by searching around. Anyone know how to accomplish what I'm expecting? Thanks.
  8. udbhav

    Make tilemap/world fit in game?

    Hi, I just learned some basics of using tilemaps. I created a tilemap using Tiled, containing 32x32px tiles. The problem is, I can't resize the entire tilemap to fit the entire canvas. I need the layer in the tilemap or the world itself to fit the canvas. scale.setTo() works, but that's relative and I want to set the width and height to that of the game's canvas. Changing displayWidth and width doesn't seem to have any effects. The tilemap still appears small in the upper left corner of the canvas. Any suggestions guys? Code: var playLevel = { create: function() { this.map = this.game.add.tilemap('tilemap'); this.map.addTilesetImage('sewer', 'sewerTileset'); //Need to make this layer larger by a specified amount this.groundLayer = this.map.createLayer('Ground'); this.map.setCollisionBetween(1, 200, true, 'Ground'); this.groundLayer.resizeWorld(); }, update: function() { } } EDIT: I just found out that changing width and height DOES work. But for some reason, instead of the tilemap's width being 32 * 20 = 640, it returned 940, which is the width of the canvas. But the tilemap itself looks to be 640 pixels wide, so I don't know why the width and height properties don't correspond to the actual ones. So I guess I can't use it?
  9. Ahmed Khalifa

    Changing world position

    Hello everyone, I am trying to make the screen scale automatically based on the browser window. So I used the scale variable in world to scale it. I was trying to center it so I used the following code: this.world.x = Math.floor((this.game.width - Global.SCALE * Global.WIDTH) / 2); this.world.y = Math.floor((this.game.height - Global.SCALE * Global.HEIGHT) / 2); which didn't work nothing on the screen moved, I tried world.position.x/world.position.y and world.left/world.top and still nothing changed. Any help?
  10. scofieldly

    how to rotate pointer's X Y

    Hi all, Currently I try to rotate the game 90 degree to meet the portrait mode for my [landscape] game, I used other's solution to rotate all display object by this.game.scale.setGameSize(, ; and Phaser.World.prototype.displayObjectUpdateTransform = function() { if(!this.game.scale.correct) { this.x = this.game.camera.y + this.game.width; this.y = -this.game.camera.x; this.rotation = Phaser.Math.degToRad(Phaser.Math.wrapAngle(90)); } else { this.x = -this.game.camera.x; this.y = -this.game.camera.y; this.rotation = 0; } PIXI.DisplayObject.prototype.updateTransform.call(this); }; now all display object are rotated, but the pointer are not rotate, so when I want to do something with activePointer like: calculation with the mouse position drag and drop logic the x, y are reversed. So I want to know is there any good solution to switch the x, y of the pointer, thx.
  11. Beastmaster

    Game world scale problem

    Hi. My game size is : var game = new Phaser.Game(640, 780, Phaser.CANVAS, 'game'); I have resized it to : this.world.resize(640, 10000); player position : this.player = this.add.sprite(320, 9952, 'player'); this.camera.follow(this.player); When I am using scaling, such as : this.game.world.scale.set(2,2); or gofull: function () { if (this.game.scale.isFullScreen){ this.game.scale.stopFullScreen(); } else { this.game.scale.startFullScreen(false, false); } }, it set my player and camera position 0, 0 ( at the top of the game ), when using gofull() function it only changes position when fire stopFullScreen(), with startFullScreen() there is no problem I'm probably wrong to use resized world and scale.
  12. Hello, Evaluating Web Audio API, for 3D sound, mixed HowlerJS with BJS without realizing: Oh, Babylon.Sound ... ? Whylookathat, lots of sound! : ) Thanks to answer below, with links. I will head that way. Related question is around WebAudio API AudioContext and -> compressors, oscillators, reverb, etc. with JS! +1. That should all be available through the AudioContext in Web Audio API... if there is an example. If not. I'll dig down, figure it out, and put it here.... : ) Applying 3D Sound with BABYLON.Sound. : ) Cheers.
  13. I made two maps with Tiled, start with Isometric then I have changed to Ortogonal and set the width to 32 pixels. I have a Javaascript function to read the JSON map and use "game.add.isoSprite" to show the sprites in Browser. When did I make maps with diferent sizes it didn't work in the same way. First town map (Stade 1): widh: 14 pixels height: 20 pixels this.hero.anchor.setTo( 0.5 ); Second town map Stade 2: widh: 20 pixels height: 8 pixels this.hero.anchor.setTo( 1.1 ); I set up the anchor with diferent value and then then hero walk over the map. // Set the First world size this.game.world.setBounds( 0, 0, (14+2) * 64, (20+2) * 32); this.game.physics.startSystem(Phaser.Plugin.Isometric.ISOARCADE); this.game.physics.isoArcade.bounds.widthX = 14 * 32; this.game.physics.isoArcade.bounds.widthY = 20 * 32; // Set the Second world size this.game.world.setBounds( 0, 0, (2 + 20) * 64, (2 + 8) * 32); this.game.physics.startSystem(Phaser.Plugin.Isometric.ISOARCADE); this.game.physics.isoArcade.bounds.widthX = 20 * 32; this.game.physics.isoArcade.bounds.widthY = 8 * 32; //Loop var oSprite = jogo.add.isoSprite(posX, posY, 0, imagemCarregada, qualSprite , group); oSprite.anchor.set(0.5); //hero this.hero.game.add.isoSprite(x, y, 0, loadImage, imagem , grupo); //In the First Map this.hero.anchor.setTo( 0.5 ); //In the Second Map this.hero.anchor.setTo( 1.1 ); I use a lot of values and didn't work equality in two maps. My englsh isn't good.
  14. Hi there, I'm trying to zoom out the entire game world from the center.. unfortunately I see no method for the camera for zooming out so I'm scaling the game.world directly with this.game.world.scale.setTo(0.5, 0.5);Unfortunately, this scales around the top left of the screen. I've tried setting the anchor on the game.world as well as the pivot to the center of the world or the center of the stage to no avail. Is it possible to achieve what I'm trying to do? Thanks for any thoughts - Nick
  15. SvenFrankson

    Spherical voxels

    Hi everyone, Here's my last BabylonJS project. It's a port of a previous one I had made with Unity. The concept is about Spherical Voxels. A sphere is divided in degenerated-squares, allowing to create a minecraft-like voxel terrain on it. You may try it here : http://svenfrankson.github.io/PlanetBuilderWeb/index.html And source code is available here : https://github.com/SvenFrankson/planet-builder-web Have a nice day !
  16. Hi, Does anyone know what can be an issue? I am having a gap on the right and on the bottom with Phaser Box2d.
  17. devx123x

    Finding mouse position in world

    How can I find the pointer's x/y coordinates in the world? Can I convert between camera and world coordinates?
  18. Hi, new to Phaser. I am having a little difficulty understanding the concepts of the Stage vs the World, which one controls what is rendered, and why they apparently don't match my Game dimensions. I am using Phaser 2.6.2. I create a Game with width 607 and height 1080 (16:9 portrait, would be pixel-perfect in fullscreen), and in my boot script I set scale mode to SHOW_ALL and set pageAlignHorizontally to true. In my first level, I set the game.stage.backgroundColor, and I create a group of buttons, and I set the buttonGroup.alignIn(this.game.world.bounds, Phaser.BOTTOM_CENTER). As expected, I see what appears to be the correctly sized rectangle, scaled down slightly to fit within my non-fullscreen browser window, with a row of buttons at the bottom. However, I noticed that there seems to be an "edge" in my game where rendering stops. I added a debug rectangle set to the bounds of my button group, and I didn't see it. I then set the y value to be bounds.y -100, to push it "up", and this is what I see: You can't see the pointer, but you can see the pointer debug location, the y value is 919, and the pointer is a the bottom edge of the visible part of the green debug rectangle (that should be the height of the buttons). And you can also see that rendering is getting cut off on the right, before the right edge of the Game (as seen by the background color). But yet - the buttons are still visible, and they are below the point where the rendering seems to be getting cut off? I then did some logging, and found out that the bounds of the World and the Stage do not match the dimensions of the Game (these are numbers for game.world.getBounds() and game.stage.getBounds()): world x: -156 world y: 0.5 world height: 75 world width: 920 stage x: -156 stage y: 0 stage height: 920 stage width: 920 Now, the 920 height of the Stage seems to match where the rendering is getting cut off at y = 920 in the screenshot. The World numbers make no sense to me at all, and I can't figure out what corresponds to the right side edge of the rendering. I was under the impression that without explicitly resizing the World, it would be the same dimensions as my Game? So my questions are: What is causing the rendering to cut off where it is? Does the World bounds define what gets rendered, or does the Stage bounds define what gets rendered? Why aren't my Stage and World dimensions the same as my Game, considering I did not explicitly size or resize either one? Why are the buttons still visible even though they appear below the line where rendering is getting cut off? If the Stage bounds do not match the dimensions of my Game, why did game.stage.backgroundColor appear to correctly color in the the background of what I expected the Game dimensions to be? Bonus question: The answer here: Says that you can put UI elements in the Stage.. should I be adding my buttons to the Stage? How exactly do you do that? I had added them by adding a group to the Game, then adding the Button objects to the group. Does that mean they live in the World? Or the Stage?
  19. I am trying to implement a zoom/drag functionality with some menus over the map. Think of Age o Empires 3, you basically have a map on which you can do zoom and drag, but you also have som menus that are always over the screen. Check this for clarity. So far. I have implemented the zoom/drag by modyfing the x, y and scale attributes of game.scale. But this work pretty good when the scale is big enough to cover the whole screen. But what I need is some kind of viewport that is smaller than the screen (like in Age of Empires) where all the zoom/drag works. The remaining parts of the screen that are not part of the viewport are filled by the UI menus. So far I have put the menus outside the world like I posted here. I attached an image with what I mean by viewport and menus in case is not clear Thanks :)!
  20. I have a complex modular character. The character has a parent (Anchor) mesh and many child meshes. I want to target FollowCamera on one of the child meshes (Head). When I assign Head to FollowCamera.lockedTarget the behavior is not desired. The camera points at coordinates that match the Anchor element. The camera appears to follow the local position of Head and not the expected world position. Check this play ground http://www.babylonjs-playground.com/#ZXP4M#11
  21. Good day to all! I have a question on Phaser's world-to-screen transformations, and I've googled almost nothing on it Is there a way to transform a sprite's world coordinates into the screen space (and visa versa)? It is a very useful feature and I can't beleave nobody still interested in it! I found poor documented Sprite.worldTransform.tx, Sprite.worldTransform.ty,but I'm not sure these fields always work properly (to be honest, I am sure they don't). Thank you!
  22. Hello, I can't seem to understand why this is happening: Here, I just want to load a tilemap made in Tiled, it's a 35*15 tile map, each tile is 64*64px as are the tile in my tilesheet (2240*960 in total). So I followed this example from Phaser (apparently some of them are not accurate...) and the layer doesn't resize. I get that on the browser the map is displayed with the total width and height inside the game element which has the size I want, and that's my problem !
  23. Jerkoco

    How World Works ?

    Hello ! How world works in Phaser ? The elements of the world are in an array and the objects inside the camera are taken from the array and rendered ? Is the world divided in 'chunks' and some parts are rendered ? Thanks a lot.
  24. Jerkoco

    How Camera works ?

    Hello ! I'm currently making a custom engine in JavaScript (canvas). I already did sprites, particles, events (touch, keyboard, mouse) and a basic script to render tilemaps (no scrolling yet) I want to code the scrolling, camera and world system. If I create a game with a world of 30,000 pixels width and 15,000 pixels height, and my camera is in 800x and 800y for exemple; should I: -Call render and update functions for every element in the world (even if they are outside the canvas) -Get elements who are in the camera to update and render them. - Should I do something else ? What is the best thing to do ? Thanks
  25. Hello, I am trying to make a small basketball free-throw game similar to the emoji basketball game on Facebook. I was following along with an example from Phaser (World Bounds Event) to try to respawn the ball when it hit the edge of the screen. I've tried to implement that below (see code) but the respawn function never fires. Does anyone know what I'm doing wrong? Envirolympics.TestGame = function (game) { //Variables this.score = null; this.scoreText = null; this.ball = null; this.net = null; this.leftMarker = null; this.rightMarker = null; this.launched = false; this.lastPointerPos = null; //Constants this.GRAVITY = 980; this.SHOOT_FORCE = 850; this.EDGE_CUSHION = 10; }; Envirolympics.TestGame.prototype = { create : function () { //Load net sprite this.net = this.game.add.sprite(this.game.world.centerX, 100, 'net'); this.net.anchor.setTo(0.5); //Add hoop children markers this.leftMarker = this.net.addChild(this.game.make.sprite(-50, 40, 'marker')); this.leftMarker.anchor.setTo(0.5); this.rightMarker = this.net.addChild(this.game.make.sprite(50, 40, 'marker')); this.rightMarker.anchor.setTo(0.5); //Load ball sprite this.ball = this.game.add.sprite(this.game.world.centerX, this.game.world.height - 100, 'ball'); this.ball.anchor.setTo(0.5); //Setting up the physics environment this.game.physics.startSystem(Phaser.Physics.ARCADE); this.game.physics.arcade.gravity.y = this.GRAVITY; //Setting up the ball physics this.game.physics.arcade.enable(this.ball); this.ball.body.bounce.setTo(0.35); this.ball.body.moves = false; this.ball.body.velocity.setTo(0, 0); this.ball.body.allowGravity = false; this.ball.body.collideWorldBounds = true; this.ball.body.onWorldBounds = new Phaser.Signal(); this.ball.body.onWorldBounds.add(this.respawn, this); //Enable input this.ball.inputEnabled = true; this.game.input.onDown.add(this.track, this); this.game.input.onUp.add(this.launch, this); //Initialize this.score = 0; this.scoreText = this.game.add.bitmapText(10, 10, 'pixel', this.score, 36); this.lastPointerPos = new Phaser.Point(0, 0); //For mobile Phaser.Canvas.setTouchAction(this.game.canvas, "auto"); this.game.input.touch.preventDefault = false; }, update : function () { //TO DO: //detect collision with net markers //determine if scored //respawn }, track : function () { //Update the last finger position this.lastPointerPos.x = this.input.x; this.lastPointerPos.y = this.input.y; //Set the ball physics to be still this.launched = true; this.ball.body.moves = false; this.ball.body.velocity.setTo(0, 0); this.ball.body.allowGravity = false; }, launch : function () { if (this.launched) { this.launched = false; this.ball.body.moves = true; this.ball.body.allowGravity = true; //Get the direction of finger swipe, normalize it, and apply a scalar to the velocity of the ball var direction = new Phaser.Point(this.input.x - this.lastPointerPos.x, this.input.y - this.lastPointerPos.y); direction.x = this.game.math.snapTo(direction.x, 5); direction.y = this.game.math.snapTo(direction.y, 5); Phaser.Point.normalize(direction, direction); if (direction.y < 0) { this.ball.body.velocity.setTo(direction.x * this.SHOOT_FORCE, direction.y * this.SHOOT_FORCE); } } }, respawn : function () { console.log("Does this function even run?"); //Set the ball physics to be still again this.ball.body.moves = false; this.ball.body.velocity.setTo(0, 0); this.ball.body.allowGravity = false; //Spawn the ball in a new, random location var ballSpawnX = this.game.rnd.integerInRange(this.ball.width + this.EDGE_CUSHION, this.world.width - this.EDGE_CUSHION); ballSpawnX = this.game.math.snapTo(ballSpawnX, 10); //Make sure the ball is in the boundary we set if (ballSpawnX < this.ball.width + this.EDGE_CUSHION) { ballSpawnX = this.ball.width + this.EDGE_CUSHION; } else if (ballSpawnX > this.world.width - this.EDGE_CUSHION) { ballSpawnX = this.world.width - this.EDGE_CUSHION; } this.ball.x = ballSpawnX; } };