Search the Community
Showing results for tags 'Math'.
-
Hi a little new puzzle game from me. https://oliver77.itch.io/creek-puzzle Made with Phaser 3. Thanks for feedback!
-
I teach 1st grade. I like making educational games. (Using Gamemaker Studio) All the games on this webpage are HTML 5 games I've made. https://k1school.weebly.com/games.html Feel free to hotlink any of my games if you have your own website. I plan to update a lot of stuff over the Christmas break...starting today... Youtube Videos of some of my games : LINK
-
Hello Everyone! I just released my new game Zombie Math! It is a math game in Slitherio style, where you need to solve math problems and earn scores. Cool Feature : This game has a backend(PHP) where you can add more math questions. Please check out the game and let me know your feedback! Demo Link : Game: https://hamzawasim.net/portfolio/zombiemath Backend: https://hamzawasim.net/portfolio/zombiemath/backend Backend Login Details: Usename: admin Password: admin1234 Purchase Link : https://codecanyon.net/item/zombie-math-html5-game-with-backend-construct-3-construct-2-c3p-capx-php/27493144 Thanks!
-
Also known as Cross Sums, Kakuro is a mix between a crossword and sudoku puzzle. Unlike a crossword puzzle where the clue is a word or phrase, a Kakuro clue is a number that the corresponding answer cells must add up to. That’s where the sudoku part comes in. Each clue has at least 2 and no more than 9 answer cells. Each answer cell must be a single digit (1-9). Duplicate digits are not allowed within a clue (4 = 1+3, 4 ≠ 2+2). Web: https://www.kakurogame.com iOS: https://itunes.apple.com/us/app/kakuro-game/id1436552307 Android: https://play.google.com/store/apps/details?id=com.kakurogame.kakuro_final
-
Hi guys! Main character in my game is this cat: Cat is composed from two parts - the torso and the head - and for each part I want to have physics body enabled, therefore I decided all parts will be inside a group. During the gameplay, I apply certain amount of velocity to the cat torso and cat then should rotate around its own axis, clock-wise and counter clockwise. I chose the approach to apply velocity to the torso and I want to position the head according the torso in the update method. Basically I want to achieve the same behaviour as Sprite.addChild() (add head as a child of a torso), but I want to do it in a group. I imagine basic (pseudo)code should look like this: export class Cat extends Phaser.Group { private _torso: Phaser.Sprite; private _catHead: Phaser.Sprite; private _torsoHeadDistance: number; public constructor(game: Phaser.Game, startPosY: number) { super(game); //torso this._torso = game.add.sprite(game.world.centerX, startPosY, "torso"); this._torso.anchor.setTo(0.5); this._torso.scale.setTo(0.5); //head this._catHead = game.add.sprite(this._torso.x, this._torso.top, "head"); this._catHead.anchor.setTo(0.5, 0.7); this._catHead.scale.setTo(0.3); this.add(this._torso); this.add(this._catHead); game.physics.enable(this._torso, Phaser.Physics.ARCADE); game.physics.enable(this._catHead, Phaser.Physics.ARCADE); //Get the distance between both parts this._torsoHeadDistance = this.game.physics.arcade.distanceBetween(this._torso, this._catHead, true); } //This will be called when player interacts with the game public AddVelocity(angle, speed, angularVel: number) { this._game.physics.arcade.velocityFromAngle(angle, speed, this._torso.body.velocity); this._torso.body.angularVelocity = angularVel; } //Called from update each frame public UpdatePosition(){ //pseudo code this._catHead.position = this._torso.position + _torsoHeadDistance; this._catHead.rotation = this._torso.rotation; } } Basically I just want retain the same distance between both sprites in the group within the time. The problem is that I am not able to figure out the code which should be in UpdatePosition() method. I know it should be something with vectors and normalizing, but I already spent few hours solving this without success. Can someone point me closer to the solution, please? I start to be desperate... Thanks in advance!
-
Hi all, This may be an easy question but I cannot seem to solve it myself after several attempts. For my Model Train Simulator in BabylonJS I'm creating a helix/spiral track, allowing trains on a lower section to quickly gain altitude within a short area (e.g. climbing a mountain). This is often used in 'hidden' sections on model train displays to have a train pass a valley track and next pass a mountain bridge which is position much higher (Y position) in the scene. When I construct the points of a helix/spiral using the formula from the docs https://doc.babylonjs.com/babylon101/parametric_shapes https://www.babylonjs-playground.com/#165IV6#61 And then use Path3D on these points to get the normals see the docs https://doc.babylonjs.com/how_to/how_to_use_path3d https://www.babylonjs-playground.com/#2DLXYB#1 https://www.babylonjs-playground.com/#8ICWNU Then I get an ever increasing cant/superelevation of my track, see the blue arrows in the picture which indicate the 'up' vectors. The result is that the track at the top has a cant. I use the Tangent, Normal and Binormal from the Path3D of the line/points to set the track rail and bed geometry, and position the train always perpendicular to the track (that is: up). But I want to have the Up vector always Vector3.Up(), or at least that there is no cant/superelevation and I can continue placing 'flat' track with it's normal Vector3.Up() on the top. The big blue arrow indicates Vector3.Up(). Current 'vector up' results from Path3D in my game: Blue = up vector (from Path3D). Large blue with _ = helix direction (Y axis) Yellow line through track = Line through the spiral center points (radius * cos t, radius * sin t, ascentfactor * t) Desired 'vector up' on the spiral/helix: (image found at http://www.easyhelix.com) Hope someone knows how to 'alter' the results from Path3D so I get the helix point orientation but without the cant/superelevation. So that I can 'lay the track' properly without trains 'falling off the track' because of cant/superelevation. Bonus questions: - the yellow marked area in the skybox marks another bug that is caused with a reflection texture intersection with the skybox. the default background color comes through on the waves. - the red box marks a mesh (air balloon) with a physics impostor that is already moving, but I want the physics computation to be paused until the user presses some 'start to play'-button, instead of physics computation right from the moment the scene is loading Happy coding, Q -
Welcome to online Math Mahjong Relax. Math Mahjong Relax is a traditional solitaire game where you have to take apart the construction made of dice. The game helps to improve your attention, speed and math skills. Dice differ in the image on the upper edge. With one move, you can get only two same and open dice. The dice is considered open if its left or right face is open. The game includes 36 levels from simple to complex ones. In the beginner levels you will learn the rules, find out which dice differ and which ones can be interchangeable. Online Math Mahjong Relax iOS Math Mahjong Relax Android Math Mahjong Relax
-
Math Number Challenge In this game, you need be finding figures for speed. It looks quite easy for the first time. However, at every level new tasks appear complicating the search for numbers. In the game, you will learn figures in the decimal system. You will find out how to count to 10 with Roman figures. Moreover, you are going to learn to quickly search for figures matching the sides of the dice. Some figures (in complex levels) are represented as arithmetic expressions and you will have to calculate the amount or difference before to choose the right number. Play Online Version Play iOS Version Play Android Version
-
Based on this classic puzzle, we created a game called Math Tower of Hanoi. The game contains of 18 levels - from simple ones to complex ones. The smallest disk has number 1 on it, the next disk is larger and has number 2 and so on up to the largest disk that has number 8, accordingly. The main goal of this game is to move the disks so that the amount of the digits on all the disks in the bars would match the target. The fewer steps you make during the game, the more points you will get for the puzzle. You are allowed to move only one disk at a time. You cannot put a larger disk on a smaller one. You will get other math tasks between the levels. Play and improve your skills in mental counting. Online Version Android Version iOS Version
-
Does anyone know how to rotate a sprite from it's current rotation? I'm having a Math brain fart. Here is my Sandbox example of the issue: http://phaser.io/sandbox/HhWNhhmR/play The sprite rotates around it's center when you drag it, but it always snaps to the mouse. How can we rotate it from where it currently is? I would love to have it respond in a similar way that PropellerJS works. As a bonus, it would be awesome to add the inertia and stepped angle constraints. Thanks!
-
Math pixel puzzle is a very unusual game. The rules are very simple. You will see an image with pixels of various colors. After three seconds, the pixels fly apart in 3D space. Your task is to rotate the space so that the image appears as originally. In the upper left corner you will find a hint - a small picture. You’ll need to collect an image so that it becomes exactly the same as the one in the hint. If it gets upside down or inclined – let’s look for more options to solve this puzzle. The difficulty of the levels increases at every level. In this game, we collected figures from 0 to 9 and pictures of geometric shapes: circle, square, triangle, parallelogram, cube and star. Do not spend too much time as it is limited. The faster you solve the puzzle, the more points you will get. Game Play Video https://www.youtube.com/embed/wuCh4hVShZI Cordova Project for iOS and Android Google Play pluging GameCenter plugin Heyzap plugin (admob, UnityAds) Firebase plugin Play Math Pixel Puzzle Online Download Math Pixel Puzzle on AppStore Get Math Pixel Puzzle on Google Play
-
1024 Math Remix on classic game 2048. 1024 Math reminds a game of 2048 from Gabriele Cirulli. There are 18 levels in this game. You need to complete all the goals when you get at each level. https://playcoolmath.com/en/math-games/1024-math Play 1024 Math
-
I spent around 4 hours scratching my head and still can't figure this out! If you throw an object in front of you and then move left or right, how can you tell which side you are on? I'm using BabylonJS so it would be super helpful if you could limit the methods used to that library. Otherwise, a clear mathematical question would suffice. Thank you so much!
-
Hi All, Math Addict - is a fully responsive HTML5 Game, combine at least two numbers to equal to the given number. https://www.brainler.com/math-addict-game regards
-
Hi All, This is my first game using PhaserJS ,packed using cordova. Math Mind – is a mathematical game in which you have to solve a lot of interesting numerical problems within the given time duration, test your Math Mind on various numerical operations and, if necessary, to develop this skill.Game Features: - Three Game Modes- Find the Operator - in this math game mode you have to find the correct operator which will make the given number from the other two numbers.;- Find the Number - in this math game mode you have to find the missing number which will make the given number provided a number and an operator.;- Geek Mode - This level is for Geek Math Mind Peoples as it has three types of questions randomly appearing.;This Math Game makes the math fun.Its free to download. IOS version coming soonplease download and rate us it will help me in looking into more game development. Play Store Link : https://play.google.com/store/apps/details?id=com.DP.MathMind
-
This is my current setup: .Player presses the Mouse button .A Ray is fired using Babylon and the players camera The intersection point (vector3) is sent to the server The server uses Cannon to do it's own intersection testing (Using the player's head hitbox(Same location as the camera client-side) as the origin point, and the vector3 from the client as the target point. Now, if I wanted the server to be a bit more authoritative when it comes to hit detection, I shouldn't send the point from Babylon, but rather a 'fire' command, and, somehow, calculate a point that Cannon can use for it's own testing. The server is aware of the position of the origin vector, and has the rotation of the player's physics body. Now, my math is worse than bad, so: Would it be possible to calculate a point, a fixed distance away, using only the origin vector and the direction in which the point should be placed? I've seen various posts and discussions about it, but I really don't quite get it. Oh. And I know aimbotting isn't impossible to prevent, but I feel like the above method, that I already use, makes a bit too easy to achieve.
-
I'm doing a label system, you can see the original post here. I don't think it's relevant but you get the background. To make it work, I created various faces on a mesh. Each faces generate a label. To know which one has to be displayed, I would like to compare their angle to the camera to know if it's facing the camera enough to be visible. After some research I came with this : http://www.babylonjs-playground.com/#QNJ03P#1 I'm pretty bad in 3D math but I already found some usefull posts and PG on the forums and the doc. - I think I'm pretty close but I don't know why my camera Quaternion doesn't seems to be refreshed when I rotate the camera (except for the Y axis which switch btw 0 and -0). - Also I'm not sure how to compare both quat so that I can say if the difference is less than 40° I can display it - And finally when I apply the function toQuaternion() on the ground it rotates it. I have the same issues with my faces and I don't know if it will changes something or not. Could someone give some insight to finish this ?
-
We just released our latest game: Number Tumbler! (We're really betting on people liking to tumble things, I guess) It's a mathematical game about adding numbers! A number crunch in a time crunch is what we're calling it. Our unnofficial slogan for the game is "It's more fun than it sounds! Really, we swear!" ... at least one of us on the team really needs to get better at copy writing. If you're interested in trying it out, you can play it on our website (on your computer, phone, or smart refrigerator) https://lumoludo.com/numbertumbler Or download it in app form on your favorite mobile device (provided that your favorite mobile device isn't a Windows Phone) https://itunes.apple.com/us/app/number-tumbler-number-crunching/id1155829197?ls=1 https://play.google.com/store/apps/details?id=com.lumoludo.numbertumbler On a side note, I was just reading the Phaser newsletter yesterday and saw that Emanuele Feronato is releasing their DrawSum game on the app store. Man, we hadn't seen DrawSum before yesterday, but I guess it's just poor timing on our part we happened to just finish such a similar game at the same time. If you take the time to play it, we'd love to get your feedback! Any comments, criticisms, and (most importantly!) praise will be graciously received. Thanks!
-
Hi Again, Let me explain what I'm trying to do first: I want a panel of 3D objects which line up along the left-hand side of the canvas/viewport. I'm trying to create an object factory of sorts. The user will click and drag objects from the object factory into the scene proper, the code will clone the selected object when this occurs. I'm using two scenes for this, one is the main scene, with a ground and control-enabled camera receiving the clones and accumulating state; and another scene, for the factory, that is essentially static but has a camera and lights and meshes (the factory prototypes). As I've said, I want this factory to be arrayed down the left-hand side of the screen. If I choose just any position for the factory objects, they will go into and out of scope when the canvas aspect ratio changes. So I want to be able to calculate a ray which vertically cuts the camera's left-hand viewing-frustum plane, say somewhere in the middle, parallel to the near and far edges. I think this should be a vertical slice, abutting the left edge of the viewport. Here's how I tried to do it: First, I tried using getFrustumPlanes. But the planes it gave me were oddly skewed. When I generated geometric planes for each of the six, for instance, they did not form a convex solid. And even when I mentally tried to figure out which plane was which part of the frustum, I just couldn't make sense of the numbers. I would have expected 2 along each camera-centric axis (e.g. + & - along X, + & - along Y, + and - along Z--I setup a straight-on camera to help in understanding the numbers to no avail). Next, I tried a few of the unproject methods. I think these methods should have converted a 2D point on the screen to a 3D point (or ray) in the world. I read through many posts on this site to use what I thought were the best values for the camera's projection matrix, world matrix (identity), etc.... Never got anything even close to good numbers. Mostly they were NaN until I saw one post which accessed maxima from the engine. But when I positioned my mesh (using a sphere) at the returned 3D vector, it always seemed to go to the same, incorrect place (irrespective of my choice for 2D starting point). Next, I successfully wrote an iterative algorithm which used many of the same transformation matrices along with project. This way, I would choose a 3D point, test where it was in 2D, and knowing the fixed orientation of the camera, choose another 3D point which projected closer to the 2D point for which I was aiming, etc.... Sort of like a newton's method for iteratively approaching the correct value that unproject should give me in fixed time. OK, I can do it, but I want to do it correctly. So my last attempt, for which I have a playground, uses: createPickingRayInCameraSpace. I think this should give me a ray which looks like a point, but really rides the intersection of the left and top viewing-frustum planes (because I choose 0,0). However it does not. Playground demo: http://www.babylonjs-playground.com/#1CHH2O#1 Please help. I don't care if I use any of these methods. Is there a better way? Should I be using the aspect ratio directly? Should I just do my own matrix math? Thanks, Ken
-
I need some help with color math. I am trying to create height maps in code... i can read raw terrain data and get the float raw height value for each pixel (x,y) as a value from 0 to 1 0 being black and 1 being white. I need to convert that 0 to 1 float to a black and white pixel based on the level of 0 to 1. Here is an example code block.. I need to basically create a Color.FromFloat type function as listed below: Texture2D duplicateHeightMap = new Texture2D(terrain.terrainData.heightmapWidth, terrain.terrainData.heightmapHeight, TextureFormat.ARGB32, false); float[,] rawHeights = terrain.terrainData.GetHeights(0, 0, terrain.terrainData.heightmapWidth, terrain.terrainData.heightmapHeight); /// run through the array row by row for (int y=0; y < duplicateHeightMap.height; y++) { for (int x=0; x < duplicateHeightMap.width; x++) { // height map color (0 to 1) float rawHeight = rawHeights[x, y]; // NOTE: HERE IS WHERE I NEED HELP (MAYBE GRAYSCALE ???) Color color = Color.FromFloat(rawHeight); duplicateHeightMap.SetPixel(x, y, color); } } // Apply all SetPixel calls duplicateHeightMap.Apply();
-
Hi all, I know it isn't really babylon related, but there are a lot of smart guys around so i believe it to be worth a try and ask I have been working on & testing some area calculations, mainly for finding meshes within a certain select area, think "area of effect" game abilities. Examples; For a square area, I simply use two vector3's, one containing minX, minZ and the other one containing maxX and maxZ, thus creating a virtual square which you can use to check if any meshes are found within it. Resulting in a very lightweight & simple solution. For a circular area, I use a starting middel point of the circle (x & z position), and a pre-set radius/distance value and then i calculate & check distance to meshes and select all meshes which are valid and in-range, But now to the issue at hand, Finding a cone area; Basicly, a small select part of a circle area, calculated depending on a player's rotation.y, a pre-set radius/distance value and a pre-set "width" value. Visualization; So in the above visualization, if a mesh was found within the cone area shown in the "width" illustration, it should be a hit, but if it was outside the defined area, it should be ignored, even if the mesh is within the circles radius.. How would you go about doing this? I have setup a PG containing the basic circular calculations, (open browser console for code feeback). http://www.babylonjs-playground.com/#2KMFW6#5 I appreciate any help & ideas.. Cheers. -
So, circles are confounding me today... About twenty years ago I did GCSE maths and remember wondering when or why I would ever need to know any of this stuff about circles and angles and the like. Now. Now is when I need to know all that stuff. So I've been all over the interwebz and have learned lots about circles, but while there are myriad explainations of how to work out the length of an arc, the angle and area of a sector... and use both radians and degrees to calculate same; I can find nothing that will tell me which sector a given value (theta, radian, degree, whatever) is in. If I've divided my circle into 12 segments, can I pass a value and know that it belongs in sector 3, for instance?
-
I found myself making a class called MatrixComp, which is the rotation, translation, & scaling components of a BABYLON.Matrix broken out. When trying to scale the matrices of a pose from a library, more than just scaling the translation is required to account for skeletons which might have different postures / builds (rotation at rest). Otherwise, the skeleton assumes the posture of the skeleton used to make the library, which can look weird. I added methods to compute the ratios of each component's rest value (called basis) to the rest value that of the library. Often, the translation of a dimension is zero, so using the divide function results in a NaN. I wrote my own, shown below. Is there any interest in changing the division behavior to this? a NaN is really not useful. this.translationBasisRatio = BABYLON.Vector3.Zero(); if (libraryBasis.translation.x !== 0) this.translationBasisRatio.x = this.translation.x / libraryBasis.translation.x; if (libraryBasis.translation.y !== 0) this.translationBasisRatio.y = this.translation.y / libraryBasis.translation.y; if (libraryBasis.translation.z !== 0) this.translationBasisRatio.z = this.translation.z / libraryBasis.translation.z; Also, there is no divide for a Quaternion, but this equivalent. Maybe, a wrapper? this.rotationBasisRatio = this.rotation.multiply(BABYLON.Quaternion.Inverse(libraryBasis.rotation)); I also ended up with my own versions of Vector3.LerpToRef & SlerpToRef. I am fine keeping all of this in my code, but some could be moved if wanted.
-
This is a math question, or maybe a question for someone who understands how billboard modes work under the hood. Given a long thin mesh with a texture of a chain, how can I position it so it looks like a chain stretches between two arbitrary positions? Here is a playground that shows sort of what I'm shooting for (until you rotate the camera, anyway). Just imagine the mesh in the middle has a texture on it like a chain or a rope. The main point is to have the "chain" mesh appear to stretch from one position to the other, while keeping its planar surface facing the camera (so that it doesn't get thin and disappear depending on the viewing angle). My instinct was this might be possible with some combination of rotation and billboard modes. If not, I guess it will be necessary to take the camera's position into account? Or if there's a simpler way to achieve what I want, that'd be great. Thanks!
-
var game = new Phaser.Game(1024, 600, Phaser.auto, 'phaser-example', { preload: preload, create: create, update: update, render: render }); var result = 'Press a key'; function preload() { //load assets game.load.image("single_turret","./img/single_turret_64x64.png"); game.load.image("mouse","./img/mouse.png"); } function create() { //start physics game.physics.startSystem(Phaser.Physics.P2JS); single_turret = game.add.sprite(400,300,'single_turret'); mousep = game.add.sprite(50,50,'mouse'); //enable psysics on all items and enable debugged game.physics.p2.enable([single_turret,mousep], true); mousep.body.setCircle(4); mousep.body.kinematic = true; single_turret.body.setCircle(4); single_turret.body.kinematic = true; } function update() { } function render(){ game.debug.text(result, 32, 32); mousep.body.x = game.input.x; mousep.body.y = game.input.y; lookAtObject(single_turret, mousep, 0.005); } function lookAtObject(obj, target, rotspeed){ var angle = Math.atan2(target.body.y - obj.body.y, target.body.x - obj.body.x); result = obj.body.rotation + '**'+ (angle + game.math.degToRad(90))+ '**'+obj.body.angle; obj.body.rotation = angle + game.math.degToRad(90); } The code above rotates the "turret" to always be pointed towards the mouse so that it can fire at the mouse position. The code works, but I want to add a rotation speed to it, however I can't figure out how to code that in. The lookAtObject() function is where I have the problem. function lookAtObject(obj, target, rotspeed){ var angle = Math.atan2(target.body.y - obj.body.y, target.body.x - obj.body.x); result = obj.body.rotation + '**'+ (angle + game.math.degToRad(90))+ '**'+obj.body.angle; if (obj.body.rotation <= angle + game.math.degToRad(90)){ obj.body.rotation += rotspeed; }else{ obj.body.rotation -= rotspeed; } } This statement does not work as intended because of how p2js works, so when It gets at ( -x , 0) the radians go from -1.5 to 4.7 and the rotation will reverse. I am really stumped atm, so any ideas on how to approach this?
.thumb.png.335033f56b0307217ca3984d00256b40.png)
