Jump to content

Search the Community

Showing results for tags 'viewport'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Standards
    • Coding and Game Design
    • Paid Promotion (Buy Banner)
  • Frameworks
    • Pixi.js
    • Phaser 3
    • Phaser 2
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
    • GameMonetize
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered
    • Marketplace (Sell Apps, Websites, Games)

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 25 results

  1. Hey all, I have a PIXI.Graphics line with about 500k points. Draws fine, I added PIXI-Viewport for zoom and pan. When I zoom in the line resolution is not good. 2 questions. Main Question, how to fix the sharpness of the line on zoom-in Second question, how can I limit the zoom and pan to the min and max of this line I've drawn? Thanks! pixi-graph.mp4
  2. Hi everyone! i made a new pixi project with pixi-viewport, which i based on this fullscreen demo: https://codesandbox.io/s/tb4qv https://tb4qv.csb.app/ Now i tested it on various smartphones, and on some phones (google pixl 3, samsung s10e, others...) its scale ration is distorted, so the red rectangle which should be a square is displayed higher than broad. Since its happening to the demo as well that i took as starting point, i think the problem should be reproducable there. Does anyone has an idea what could cause that? Greetings & thanks a lot for any idea! DiceHowl
  3. Hello Is it possible to display only part of the rendering of a camera? For example a fixed camera that films a scene by far and we just re-frame a small part and move the frame. Thank you
  4. If you try to resize window you'll see it will only resize scene (engine) but not Viewport. http://www.babylonjs-playground.com/#17DP89#8 How I can update Viewport . Any advice please?
  5. Maybe it's a silly question. I am applying alpha to an image and in the line immediately after I alert a message on screen. The problem is that the alpha is being shown up only after the alert popup be closed. There is a method that I can invoke to force screen to update BEFORE the alert? Thanks!
  6. Hi, I've successfully created a mini map. Now I'm trying to give it a custom opacity value to make it a littler transparent. I did not find any way to do this. Any help would be appreciated. Here is a good starting point for your kind help: http://www.babylonjs-playground.com/#RE9QZ#3
  7. I am currently creating a puzzle game app using Phaser and Cordova (crosswalk) but I am having some trouble with the meta viewport tags. Testing the game on my android phone with cordova, no matter what I set my meta viewport tag, the game is always extremely zoomed in on one small area of the canvas. However the reason I think this is a viewport problem, is that on chrome, when I set the meta viewport to this: <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> I get the exact same problem as in cordova, however when I don't set it at all, or set it to something like this: <meta name="viewport" content="user-scalable=no, width=3000"> The game runs perfectly fine! How can I fix this so that the canvas and cordova viewport will both work? Details: Phaser version 2.6.2 Phone model - Samsung Galaxy S7 P.S. Apologies if this is more of a Cordova problem I was not sure. A final thing I did with Cordova (if anyone has any experience with it) is set this in the config: <preference name="EnableViewportScale" value="true" /> Still no luck...
  8. Hello for 2 years now I have been developing games mostly using Java`s and libGDX or/and openGL, but now im very interested in Phaser for web-based game development and I think that is a very powerful tool. I have no problems with game logic but when i come up with render logic in Phaser I need to know if there are possibilities for: 1 Pixel to World unit conversion. ex: In libGDX I can work in 8x6 world units game instead of using pixels units (640*360 for exmaple) , that helps me to write a lot better logic 2 Multiple cameras in the same scene 1 camera for game and more than one for the HUD .
  9. Hi Myself and my friend are currently working on a game using Phaser 2.8.4 and have noticed an odd graphical glitch that we can't seem to diagnose or get rid of. As you can see in the attached GIFs when a sprite gets near to the left or top edge of the viewport it compresses and when it moves away it extends back to its original form. Those are static sprites but it seems to affect all sprites. This does not occur at the right or bottom edges of the viewport. Does anyone have any insight as to what is going on here? Thanks!
  10. I want to show a "viewport" of a target camera in a corner of the canvas that will work in VR. Surely there is a better way, but this PG shows my visual goal: https://www.babylonjs-playground.com/#HJI09Z#1 Basically I have a TargetCamera and I take screenshots and set to source of GUI image. I'm just making sure there is not a well known better way before I get more creative. My goal is for this to work well in VR. I already had it working quite well with this code - but I am trying to move away from a second viewport as I'm assuming that won't work in VR: var viewport = new BABYLON.Viewport(0.79, 0.79, 0.2, 0.2); this.secondCamera.viewport = viewport; scene.activeCameras.push(secondCamera);
  11. Hi, I am 3D graphic designer and programmer. I create 3D configurators in Realtime like on the following website. The configurators was developed on WebGL-basis and have the problem that the only load if the configurators are visible in the viewport. How I can solve the problem? Thanks.
  12. Hi all, I created PlayGround how to display the ViewCube in the upper right hand corner. ViewCube provides visual feedback about the current viewpoint of the scene. Just for fun
  13. Hi There is bug when BABYLON.GUI buttons that has been created with custom viewport on camera: buttons can be clicked even if mouse is out of button playground: https://www.babylonjs-playground.com/#08PH4F#1
  14. gamify


    hello actually i am using container renderer for background and above background placed images and images are dragging on mouse click but dragging is happening behind the game map i tried floating not working can anyone help please for drag movement
  15. HI, I'm trying to use screenspace2d as a button but when I add a viewport(minimap), the minimap becomes unclickable. Is there anyway I can change the z order or something similar to make the canvas clickable? http://www.babylonjs-playground.com/#1B4NJV#3
  16. Hi everyone: I need to implement a bezel compensation mechanism, but i dont know where to start. I have four screens acting like a big one. I don't have the option to use bezel compensation at driver level, so i need to figure it out how to make it at software. My first thought was use some kind of BABYLON.Viewport tranformation but the documentation of this class is very scarce. Any hint for accomplish this? Many thanks in advance.
  17. Hello, Because of performance and blurry text/image issues, I turned my fixed canvas resolution to a canvas with width/height dynamically equal to window.innerWidth/Height on resize. Admitting the same aspect ratio after resizing, how would you deal with the renderer to keep the same viewport ? Thanks.
  18. Hello guys, i'm totally new to Babylon and I was wondering if there's a way to check if an object is hitting the border of the screen and prevent it to get off the screen. This is what i wrote so far: http://www.babylonjs-playground.com/#SKWZP#0 I found these values manually, i hate to hard-code stuff inside my code but it was just for testing. if (box1.position.x > 6 ) { box1.position.x = 6; } if (box1.position.y > 4 ) { box1.position.y = 4; } if (box1.position.x < -6) { box1.position.x = -6; } if (box1.position.y < -4) { box1.position.y = -4; } Can you please me help to understand how can i retrieve the screen boundaries wrt the viewport?
  19. I wonder whether it is possible to translate browser viewport on Plane in 3D world. Like video texture on plane. And If this 3D plane can be interactive like browser is ??? Just ask how it is with this. Could be that possible to do? Could we have more browsers planes in 3d world which will be interactive? greetings
  20. I am curious if there is a better way to create a border around a viewport and a background around a viewport rather than creating additional viewports that have just border objects in it. I don't like this approach because i'm hiding objects in the far distance and cameras to render this stuff out. I have an example here using additional viewports to show what i am looking for. http://www.babylonjs-playground.com/#1QXZAA#2 Suggestions of how to achieve this without the additional cameras/viewports/objects? I would like just two cameras in a perfect world Thanks!
  21. Hi I am trying to develop very basic 2D car game. In the game I want to show a small map on top right side of the screen which is actually same track but with a zoomed out scene so that user can see what is coming ahead of the car. I was able to accomplish this but now my problem is in the zoomed out map car is very small mesh. Is there any view where I can change size of a particular mesh(Car) and then create a view port or can I change size of mesh(Car) in just one viewport. I am attaching screenshot of scenario and code by which I have implemented my existing code var camera1 = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 0, -8), scene);camera.viewport = new BABYLON.Viewport(0, 0, 1, 1);var camera2 = new BABYLON.FreeCamera("camera2", new BABYLON.Vector3(0, 0, -50), scene);camera2.viewport = new BABYLON.Viewport(0.8, 0.8, 0.2, 0.2);scene.activeCameras.push(camera1);scene.activeCameras.push(camera2);
  22. Hi guys, I missed you ) I have a new little problem, and I hope that you can help me. I have this example to support me: http://www.babylonjs-playground.com/#1OQMIG I want to create a minimap, but I don't know how to positionate it in front of scene map. The minimap is back of scene, in bottom-left. Thanks a lot.
  23. Hey there, I'm just getting started with Phaser, and am looking at GLSL shaders (also for the first time) to see how they can be applied to sprites for effects on characters, backgrounds, etc. I ran into behaviour today that's likely a function of how GLSL works, rather than Phaser itself, and probably not the ideal approach. In any case, I'm hoping that someone can confirm one way or the other. Currently, my game has: A TileMap background using two layers using different values for scrollFactorX/Y A Sprite for the player with a filter applied, which is being rendered correctly (although the sprite graphic itself has disappeared; more on this later) What's odd is that when navigating through the map and the filtered sprite reaches a viewport boundary, it remains "stuck" there rather than moving offscreen. Since the shader example I'm using has no knowledge of the game, and it looks like the sprite is simply unmasking the shader output, I'm wondering a few things: Am I right to assume that this doesn't work for good reasons? (If so, what are they? ) Assuming that I need shaders (versus a sprite sheet) for elements that may venture offscreen, should I be manually passing rect data to the filter that tracks the shapes I want filtered, separately from the sprite itself? I'm looking forward to any insight that folks can share, so let me know if I can provide more details. Thanks!
  24. Hello community, I'm in need of help with something on my project. I need do draw a new scene in the same scene stuck in a while loop (while the option exit isn't pressed). By that I mean, that i would like to clear the all screen when this function is started, then, when exit is pressed, the "state machine" would come back to the main scene. I'm not beeing able to find any function to do this. Any suggestions ? Thanks in advance,
  25. I'm having a little trouble to understand this: I have a canvas, let's say 480x320, and I use a div container to resize it. CSS.canvas { width: 100%; height: 100%; }JSresize(); //Here using window.innerWidth and window.innerHeight I find the dimensions of the device and I apply those measurements to the div container so the game gets resized via CSS.Viewport<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> If I use this code on a retina device, will it display the game correctly stretched or double sized? Different pov, same question: will window.innerHeight return the device pixels or the CSS pixels? I can make the same question again using different words . I want to correct the images because I don't like how retina displays resizes my game. So I make my canvas double size 960x640 and use of course bigger sprites. Using the solution above, what should I do to fit my game, stick to the window.innerHeight value or use half of it because then it will be doubled by the display? I hope someone understood my question, if not, I can still ask it in several more different ways, I feel inspired today
  • Create New...