Search the Community
Showing results for tags 'Polygon'.
-
Hello, I'm trying to export a model which is about 400,000 Polys. I know the maximum export is somewhere around 60, 000 for any one mesh. I am thinking about breaking and exporting the mesh in different parts. Will this lead to issues in the scene? Also, what is the best polygon count for a babylon scene for efficiency in web and mobile? Finaly, what is the maximum polygon count for a babylon scene before it crashes? Thank you in advance!
-
Hi, I am currently creating a polygon geometry with PIXI.Graphics. As one of the requirements of our application, we need to add fill color after we create a graphic. Is there any way to do it? Currently, we have something like below. const graphic = new PIXI.Graphics(); graphic.lineStyle(2, style.color, 1); for (..){ if (type === 1) graphic.lineTo(x, y); else graphic.moveTo(x, y); } As you can see, this will simply create a polyline but we need to find a way to fill this polyline with some color and convert it to polygon. *this needs to be a polyline when it was created It would be appreciating if you could give me any advise to achieve this.
-
There is a POLYGON SCAN game at https://www.html5pcode.com/a1ypolygonscan.htm that was designed to teach the art of coding. It uses structured programming, so it is easy to follow the logic of the design. The game is divided into small self contained pieces. It has a main program and a subprogram. The subprogram has routines that perform specific tasks when they are called by the main program. The game has links to YouTube videos that describe the operation of the main program and the subprogram routines. Once you learn how to design games like this one, you can go on to design your own games in JavaScript and/or a JS framework. This p-code lends itself to teaching coding because the source and object code are the same. The engine that created the code (source-code) is the same engine that executes the code (object-code). This makes it possible to do the following options. A DATA OPTION allows you to view the game's data, while the game is running. A TRAIL OPTION allows you to execute a few instructions at a time, so you can see what each routine is doing. A REAL TIME (RT) OPTION allows you to change instruction values, while the game is running. The YouTube videos show how these options are used in the designing of the game. There are many other games written in this p-code at https://www.html5pcode.com
-
Hi All, Below is my project url please visit : http://111.93.53.134/digital/test/polygon/ Now my question is that i am creating a polygon at run time and add physics to polygon. When the polygon collides with matter body a horizontal redline is drawn and when i click on the down arrow button then another metal spring collides with polygon shapes then a blue line draw and you can drag the blue line. So i have to take the snapshot of only that polygon and redline which is beneath the polygon and that blue line which is being dragged and show them in the grid box 1,2,3,4. The polygons can be rotate as well by middle button when the spring metal is not collides with the polygon. I have tried several ways to figure this out but not able to fix the snapshot . I am attaching the image that what i actually want. And please tell me a way to make the polygon shapes more steady while rotation. Thanks, Raghvendra
-
Hi everyone, I'm working on a javascript clone of superhexagon (https://www.superhexagon.com/) in order to learn to use Phaser 3. I was wondering what was the best way to generate the same shape multiple time with some rotation tweek and animate them. I need generate them, display them, once they display I need to be able to rotate them and scale them down. Once their scale <= 0 I need to hide and destroy them. I know I need to build a kind of Factory but I can't figure out how to do it with gameObj.add.arc Could you point a part of doc or source code I can dig in to find a solution? I created a pen here https://codepen.io/paulbonneau/pen/KGGbGO Thanks in advance ! Paul. -
I'm trying to apply physics to a animated sprite. I used PhysicsEditor to generate the JSON and loaded the polygon shape for the first frame. Collision detection is not happening when i try to clear the shapes and load the polygon dynamically with respect to animation. Is there any method to clear and load the polygon dynamically to detect collision. Any thoughts ?
-
Hello, I am new to babylonjs and am trying to extrude a non regular polygon towards the positive y direction. Going through the doc I couldn't find a way, it always extrudes it in the negative y direction. I found a hack using mesh.position.y += depth; but is there any other way of doing this ? Playground link : http://www.babylonjs-playground.com/#2EYZPE#7 Thanks.
-
Hello everybody :-) I'm trying to use ExtrudeShape for creating a building shape and am having trouble with the cap. I understand that the cap is not tessellated (triangulated) so it would be faster. But when I have concave angles in the shape, it doesn't look good. I also tried using Ribbon for the roof polygon somehow, but the tessellation doesn't happen here either of course. Here is my code: http://www.babylonjs-playground.com/#1KQZAF#0 I tried using PolygonMeshBuilder but the mesh is rotated the way I don't want it to and some walls keep dissapearing depending on the angle of view: http://www.babylonjs-playground.com/#SJLOW#1 I don't need the mesh to be updated so the speed of tessellation doesn't bother me much. What am I doing wrong? What can I do to have a tessellated building? Thanks :-)
-
Hello there, Is it possible to create destructible terrain in HTML5 and box2d Video examples : Box2d Destructable terrain.mov Box2d Destructable terrain 2.mov Any help in this direction would be much appreciated. Thanks Again
-
My sprites are often passing through polygons that they should be bouncing off of. I've tried to research this and all I could find is that the fps may be too low to always detect the collision but surely the game engine should be able to handle this? Interestingly, if I use setCircle() my colliding sprites never pass through even with much higher velocity. Why would a polygon I define behave differently than setCircle() ? Here is a demonstration: //phaser.io/sandbox/xeGQxHis
-
Hey. I am trying to using 2 polygons as mask for a sprite group. It seems to work with drawRect perfectly, when I use more than 1 (as in the example image). But whenever I try to use 2 polygons, it just apply the first one created as mask. One polygon is above the window, one being the window itself. (see the code). I have provided my example code here. poly = new Phaser.Polygon( { x: 0, y: 0 },{ x: 0, y: 255 },{ x: 153, y: 255 },{ x: 154, y: 218 }, { x: 176, y: 213 },{ x: 165, y: 215 },{ x: 165, y: 215 },{ x: 176, y: 213 }, { x: 199, y: 211 },{ x: 199, y: 211 },{ x: 201, y: 157 },{ x: 202, y: 149 }, { x: 205, y: 142 },{ x: 200, y: 139 },{ x: 199, y: 132 },{ x: 206, y: 127 }, { x: 215, y: 123 },{ x: 215, y: 123 },{ x: 231, y: 120 }, { x: 256, y: 116 },{ x: 303, y: 116 },{ x: 328, y: 119 },{ x: 349, y: 122 },{ x: 356, y: 125 }, { x: 360, y: 130 },{ x: 361, y: 151 },{ x: 365, y: 184 },{ x: 365, y: 216 }, { x: 366, y: 252 },{ x: 550, y: 251 },{ x: 552, y: 213 },{ x: 550, y: 210 }, { x: 550, y: 207 },{ x: 569, y: 201 },{ x: 591, y: 199 },{ x: 615, y: 199 }, { x: 638, y: 201 },{ x: 659, y: 204 },{ x: 675, y: 208 },{ x: 675, y: 212 }, { x: 675, y: 212 },{ x: 672, y: 213 },{ x: 671, y: 216 },{ x: 671, y: 249 }, { x: 767, y: 249 },{ x: 927, y: 239 },{ x: 947, y: 239 },{ x: 940, y: 479 }, { x: 957, y: 497 },{ x: 960, y: 509 },{ x: 960, y: 509 },{ x: 982, y: 532 }, { x: 984, y: 548 },{ x: 998, y: 568 },{ x: 1005, y: 562 },{ x: 1024, y: 561 }, { x: 1024, y: 0 } ); poly2 = new Phaser.Polygon( { x: 780, y: 280 },{ x: 876, y: 280 },{ x: 876, y: 371 }, { x: 848, y: 371 },{ x: 848, y: 352 },{ x: 779, y: 352 } ); mask = this.add.graphics(0, 0); mask.beginFill(0xFFFFFF); mask.drawPolygon(poly.points); mask.drawPolygon(poly2.points); enemies.mask = mask; Is there something I have missed or is this a bug? Is there another (better) way of doing what I am trying to archive (on the example images)? Basicly it is one big image I just want to be able to define specific areas where enemies can be shown in-game. Since I would probably need to add at least a couple more areas. Thanks for your help.
-
Hello! I am the P2 physics. I have a sprite scaled. My problem is that the polygon loaded to the sprite does not scale with it. It is possible to scale the polygon?
-
Hi, I'm trying to get a sprite to spawn within a polygon I've drawn in Tiled. I've imported the polygon like so: this.bunyipSpawnZone = new Phaser.Polygon(polygonSpawn[0][0],polygonSpawn[0][1],polygonSpawn[1][0], polygonSpawn[1][1],polygonSpawn[2][0],polygonSpawn[2][1],polygonSpawn[3][0], polygonSpawn[3][1],polygonSpawn[4][0],polygonSpawn[4][1],polygonSpawn[5][0],polygonSpawn[5][1]); polygonSpawn is the corresponding Tiled map object. Which is an array where [0] is the x coord and [1] is the y. this.bunyipSpawnZone returns a Phaser.Polygon with seemingly appropriate x and y coordinates. Phaser.Polygon_points: Array[6]0: Phaser.Pointtype: 25x: 158y: -6__proto__: Object1: Phaser.Pointtype: 25x: 20y: -852__proto__: Object2: Phaser.Pointtype: 25x: 902y: -852__proto__: Object3: Phaser.Pointtype: 25x: 892y: -996__proto__: Object4: Phaser.Pointtype: 25x: -96y: -978__proto__: Object5: Phaser.Pointtype: 25x: -114y: 0__proto__: Objectlength: 6__proto__: Array[0] area: -300120 closed: true flattened: false points: (...)type: 12 But the area is negative??? Why is that? And I can't seem fill in the area with graphics.beginFill() to verify that the polygon is in the right place. I tried using .contains for debugging as well, but that's also not giving me a true when I expect it to. Again the end goal here is to have an enemy spawn somewhere randomly in the polygon. But it seems I can't get a polygon working right. the github is https://github.com/nodes777. Any help would be appreciated. Thanks!
-
delete me
-
I'm using P2 physics, and I'm creating a relatively intricate border around the screen that I want balls to bounce against. I am scaling all assets on the screen for 3 different aspect ratios, depending on the user's screen size. I create the border like this: bgOverlay = otherSpriteGroup.create(gameWidth / 2, gameHeight / 2, "bgOverlay"); bgOverlay.anchor.setTo(0.5, 0.5); bgOverlay.scale.setTo(scale.x, scale.y); bgOverlay.body.clearShapes(); bgOverlay.body.loadPolygon("physicsData", "bgOverlay"); bgOverlay.body.setCollisionGroup(otherCollisionGroup); bgOverlay.body.collides(bubbleCollisionGroup, otherHitBubble, this); bgOverlay.body.static = true; The trick is that I scale all assets using a Phaser Point, scale.x and scale.y. But when I load in the polygon data using bgOverlay.body.loadPolygon, it takes in actual pixel values, and I can't scale bgOverlay.body. I am not sure how to scale the numbers in the physics data. Any ideas? -
I have this code to add a rectangle in phaser and works fine but it fills with a solid color and i want some transparency in my poly. Is that possible? poly = new Phaser.Polygon(p_1, p_2, p_3, p_4); graphics = game.add.graphics(0, 0); graphics.beginFill(0xFF33ff); graphics.drawPolygon(poly.points); graphics.endFill();
-
Hey there So, this is my first post in here, i hope everybody is good out there, let's go straight into the issue. I'm new to Phaser.io, and I'm intending to use it to create a hill climber clone. I have successfully create car like shapes (following a couple of online tutos) but still very confused about how to create the land on which the car will run. To make it clearer, here's an illustration of what i exactly want: So basically, the original game introduces 2+ types of ground, that are the bridges, land, water, ... I need to implement only two types. I know how to "materialize" the body and everything that should go after i declare them, which is my problem. On Phaser.io examples page there's quiet half the solution to my problem but uses Box2D which is paid (and i can afford it right now, else, i would love to get it!)
-
I found this topic where it says that graphics object in phaser has hitArea that can be any shape. I searched Phaser docs but didn't find hitArea property. Is it moved somewhere else or is there some new way how to make graphics object clickable and call certain function when a click event happens? Also how can I show cursor hand when rollover a clickable graphics object? I forgot to ask is there some official phaser example for this functionality? PS: I even searched DisplayObject class but didn't find hitArea there.
-
I was wondering are there any useful functions in Pixi.js which I can use in my Phaser 2.6 application to darken /brighten fill color of rectangles polygons etc...? For example make rgb(200, 150, 186) 10% darker. I might code a function like that in JS but should I? A tool that does the job but it works in NodeJS: https://www.npmjs.com/package/color
-
1. How can I draw closed polygon like the image above but without the diagonal black line that creates/finishes the polygon? 2. Or should I use Phaser.Polygon function at all? Is there some better solution? 3. Is it possible to create rectangle with mask smaller than the rectangle creating the image above? How would I apply border to this solution?
-
Hi, I want to scale both sprite and .json physics file, is that possible and if so, how? I ve seen a few posts about that but no answers. Thank you
-
Hey everyone, I am making a simple Worms-Armageddon-like game for educational purposes in my University course. I have a problem figuring out how to implement the following with Phaser. THE SETUP: 1.) Standard map with loaded Polygon from PhysicsEditor - image 1. I am using P2 physics but can change to Box2D if necessary. 2.) Making a hole with some weapon - image 2. THE PROBLEM: I believe I have an idea how to make the visual hole in the sprite, by using this example http://phaser.io/examples/v2/bitmapdata/alpha-mask (correct me if I am wrong or if there is a better method) I have no idea, though, how to change the body of the map by using Phaser - as in image 2. I would like to avoid doing it "by hand" with per pixel manipulation and making a new polygon manually every time. Is there an "automatic" way of calculating the polygon of a sprite by using its non-transparent pixels? Could you please help The code can be seen here and I will share the project once it is done. Thanks in advance for your time.
-
I know I keep polluting this forum with my dumb questions.. BUT, what would be the easiest way to do a collision map not using tiles. I have seen some that make a solid color and tell the player they can't step into that color. I don't know how to get the color data for that so I was going to draw polygons and use ContainsPoint and kick the player out if he steps in or near and I couldn't figure out how to add points to a polygon already drawn so now I am running around the map and writing down my player location where I want my polygon points to be drawn and I felt stupid. More than usual. Who can shine the light for me? Turns out a huge polygon doesn't know when it contains a sprite's point.
-
Hi all, I've been trying to achieve a certain effect. I have two polygons, one of which is still while the other moves, and when they overlap, I want to have the still polygon on top. However, it always seems to be the moving polygon that remains on top. I've been trying to use groups following the example here, to no avail. Here is (most of) the offending code: var LayerTest = { preload: function () { }, create: function () { game.world.setBounds(-SIZE_X / 2, -SIZE_Y / 2, SIZE_X / 2, SIZE_Y / 2); var center_group = game.add.group(); center_group.z = 1; var center_hexagon_graphics = new Phaser.Graphics(game, 0, 0); var center_hexagon_poly = buildRegularPolygon(0, 0, 6, 40); center_hexagon_graphics.beginFill(CENTER_COLOR); center_hexagon_graphics.drawPolygon(center_hexagon_poly); center_hexagon_graphics.endFill(); center_group.add(center_hexagon_graphics); var moving_group = game.add.group(); moving_group.z = 0; moving_graphics = new Phaser.Graphics(game, 0, 0); moving_group.add(moving_graphics); }, update: function () { var moving_poly = new Phaser.Polygon([ new Phaser.Point(-SIZE_X / 2 + tick, -10), new Phaser.Point(-SIZE_X / 2 + tick, 10), new Phaser.Point(20 - SIZE_X / 2 + tick, 10), new Phaser.Point(20 - SIZE_X / 2 + tick, -10), ]); moving_graphics.clear(); moving_graphics.beginFill(ALT_COLOR); moving_graphics.drawPolygon(moving_poly); moving_graphics.endFill(); tick++; }};This particular example creates a regular hexagon around (0,0), and a small yellow square in the left side of the screen that then moves right and overlaps with the hexagon. Even though I set moving_group.z to 0 and center_group.z to 1, it always paints the small square on top. I also tried to do without the groups, setting the z indices on the graphics directly, but it didn't make a difference. Any help will be much appreciated. layer-test.zip
-
Hey, I'm trying to add a custom collision polygon for a hexagon. I've measured the corners of my hexagon in illustrator: 28, 055,1655,4828,00,480,16 When I try to implement it:game.physics.p2.enable(hexagon, true);hexagon.body.clearShapes();hexagon.body.addPolygon( {} , [[28,0],[55,16],[55,48],[28,0],[0,48],[0,16]]);The collision polygon is not visible at all (in debugger). I've never tried adding a custom polygon so I have no idea what I'm doing wrong. Thanks.
