Jump to content

Search the Community

Showing results for tags 'draw'.

  • 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
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 22 results

  1. Hi all I'm CodingButter I have been developing a 2d game engine from scratch. I wanted to get some opinions about the tick and render loops. I currently have my render loop executing as fast as requestAnimationframes will let me. And I've also trigger my ticks with setTimeout. I've noticed by doing this I am consistently getting 200 ticks per second. I was wondering what the drawbacks would be for using setTimeout in this way. I personally don't seem to see anything but improvement to my game behavior. but I'm sure there is something big i'm overlooking performance wise. Any thoughts. Als
  2. I couldn't seem to find a clear solution online that would apply to me anywhere but if this has been discussed elsewhere feel free to link me there. My game's fps dips after running for only a few minutes. Shortly after my os slows down because my game uses up all the memory of the browser. I suspect the culprit is how I currently draw sprites because my "game" currently only involves placing a few sprites/text on the screen. I have my custom game framework setup to only really use Pixi.js primitives like PIXI.Texture, PIXI.Sprite, PIXI.Text, etc. My Spritesheet class currently conta
  3. Hi there, I have had a good look in the forums for this before asking, but I cannot seem to get my simple HTML canvas to run properly on my iPhoneX. My URL is here: http://lindsay.thefusion.works/ Initially I was trying to build a kaleidoscope (8 triangles making a square) but setting one triangle and then using the _cacheContext.rotate for the other 7 triangles meant that my iPhoneX was struggling to hit 3 frames per second. My old Galaxy S6 phone will render it flawlessly. The iPhone X will get really hot within a minute so it is definitely working overtime to try and keep up
  4. Hello, what i try to do is that my user will be able to draw on the game a figure, such as a rectangle, then I use the coordinates of the rectangle that he draw and when some sprite enter to that area send a message. How can i make that my user whit the mouse can draw over the game?
  5. Hello. I was curious about the system implemented in some games, in this case applied to 2d only. I am talking about the creation a character body by drawing. Can that be applied to Phaser? An simple example would be something like simply drawing a 2D polygon with a "virtual marker" and then that draw would become a phyics body ( probably getting the borders of the draw and setting making a sprite out of it). I suppose I had to implement a way for the user to draw, then get the draw as image, somehow set its borders as I previously said and then load the sprite to the game. Am I thinking corre
  6. I was wondering is there a Phaser visual subtype on which I can manipulate its alpha/transparency without redrawing it? Phaser.Graphics is ok but I need to redraw it and currently I am lost in my own code I have the graphics already drawn, it would be a lot easier to just change its alpha value. Sprite/Image does not seem to have alpha value. Is there some plug-in or perhaps some known hack?
  7. Hello, I've been following a Phaser spring example and I've been trying to remove the overlay sprite it draws on my circular physics body (I assume it adds this when I call body.setCircle(5)). Does anyone know how to remove this? I don't want to remove the body, I still want the physics, I just don't want the extra debug drawn sprite. Thanks
  8. Hello guys, I got an issue when I want to implement a drawing tool, if I move the pointer slow, it can draw a linear line, but if I move the point fast, it will have the gap between my 'brush' dot. I have attached a screenshot for this issue. My planning solution is: when the pointer isDown or is dragging, start drawing. However, it seems there are not 'dragging' or 'moving' method for input.pointer. Is there any other ways that can solve this problem? Thank you very much.
  9. Hey guys, I just start to phaser. I tried to develop a game that allow user using their fingers to draw/paint on some particular area of the mobile screen. So my solution is to create two layers, one is the background tile sprite, and the other one is sprite that allow user to draw on it. Here is my code: background = game.add.tileSprite(0, 0, 1080, 1920, 'background'); game.add.sprite(x/2, y/2, 'tree'); bmd = game.add.bitmapData(game.width, game.height); bmd.addToWorld(); game.input.addMoveCallback(paint, this); However, when I tried to draw. I cannot particularly draw on
  10. Is there some plugin or some tool inside Phaser that can help me draw a table of data. I have this image: As you can see I have two arrays of data and they are drawn in Phaser text field as string, but since the numbers inside are of different string length points array is longer than errors array and therefore cut if over the screen boundaires. How can I draw a table with this data, 3 rows by 15 columns? Also could I possibly create such plugin for Phaser?
  11. I have a game in flash that uses vector rectangles with different colors and sizes. The rectangles have round corners and white outline stroke of 4 pixels. What is the best way to implement these rectangles in a Phaser game? I might have to use 6 different colors and 10 different sizes (both horizontal and vertical). Is there anything like 9-Slice-Scaling, that we have in Adobe Flash? In case I'm not clear in explaining the round rectangle, I'm talking about the shape you get by using this css style in html: div { width:300px; height:100px; background:#0
  12. Hello everyone, in my application, I normally only need to render the 3D view after the user has changed some settings of the confugration or the view is being used (with either the mouse , finger or keyboard) the rest of the time no rendering is needed. But how can I know if Babylon is doing something that needs? For example: Can I look somewhere if the camera has stopped moving? (Especially when it's deaccelerating) Or an animation is running? Thanks for your answer! Kevin
  13. Jambutters

    Counting pixels?

    Yello, newbie here. My short story: I've been (re)watching tutorial series on web development and programming for.... about 4 years...I end up quitting due to distraction/preoccupation with other games, then find myself grinding tutorials when I have the urge to re learn(which is once a month or so). Now, since I'm out of school and no longer addicted to any particular games, I've been getting some hands on experience for the past couple days(FINALLY). I still struggle with wondering what to write but that's not the point. -End of story- Something I've always struggled wi
  14. What is the best way to draw multiple times into a PIXI.Graphics and being able to apply alpha or blend mode to the result and have a unique shape? This shows the issue: http://codepen.io/anon/pen/zGLyEW This is a failed attempt: http://codepen.io/anon/pen/mJjaGd Thanks! chr
  15. What's the right way to draw an image pixel by pixel with bitmapdata? Assuming I'm getting the data from a matrix. var image = [['rgb( 0, 0, 0)', 'rgb( 0, 0, 0)', 'rgb(255,255,255)', 'rgb( 0, 0, 0)', 'rgb( 0, 0, 0)'], ['rgb( 0, 0, 0)', 'rgb( 0, 0, 0)', 'rgb(255,255,255)', 'rgb( 0, 0, 0)', 'rgb( 0, 0, 0)'], ['rgb( 0, 0, 0)', 'rgb(255,255,255)', 'rgb(255,255,255)', 'rgb(255,255,255)', 'rgb( 0, 0, 0)'], ['rgb( 0, 0, 0)', 'rgb(255,255,255)', 'rgb(255,255,255)', 'rgb(255,255,255)', 'rgb( 0, 0, 0)'], ['rgb(255,255,2
  16. Hello, I'm wrapping up a realtime multi-user drawing app using elements from an example joshcamas posted recently. I'm not including the GUI and much of the server calls in my example below, so running this script wil provide errors, but the whole script is 3x as large. However, if someone might help me to accomplish 2 things, I would be grateful. 1. Draw on a plane using a dynamic texture. 2. The base color of the plane is a color3 white (or other.) Here's the example: Thanks, DB
  17. Hey, I was wondering if it's possible to use either CSS, Canvas, HTML or JavaScript to draw elements for a game (like blocks, characters, etc..) or would I have to use a pre-made image. If this has already been answered, please direct me to the proper thread/website. I'm self-taught so a lot of examples and "dumbing down" is greatly appreciated! Thanks again in advance.
  18. Hi, I have been using Pixi.js for a few months now and I am wondering if it is possible to erase lines drawn on a PIXI.Graphics object. Basically I have some functionality where I am able to draw on a Graphics object on a Sprite using mouse and touch events. My issue is that the sprite has a texture which is not just 1 color. If the texture was blue I would just draw with blue color to "erase" the lines i had drawn earlier with another color. If I was not using Pixi.js I could use the functionality shown here: http://cssdeck.com/labs/jwvajze4/ This eraser functionality is excactly what I
  19. Hello, I have created a line to immitate lightning as shown in the http://gamemechanicexplorer.com/ this is my code that creates the line var ctx = reg.lightningBitmap.context; var width = reg.lightningBitmap.width; var height = reg.lightningBitmap.height; // Our lightning will be made up of several line segments starting at // the center of the top edge of the bitmap and ending at the bottom edge // of the bitmap. // Clear the canvas ctx.clearRect(0, 0, width, height); ctx.lineCap = "round"; ctx.lineJoin = "mitter"; // Set the starting position and number of l
  20. Hello. I am currently developing a game with Phaser. What is the best way to draw a sprite in multiple places at the same time. Let say, I want to create a Snake-clone. My usual approach is to have a spritesheet which represents a head, body, and tail. I will then draw the part dynamically, depending on the current position, state, and length of the snake. How do I achieve this in Phaser? Creating tons of sprite might instantly solve the problems (create one sprite everytime the snake eat, and make it follow the head movement). However, I suspect the multiple sprites approach will
  21. farzher

    Drawing Lines

    I have one of these things @pathGraphic = @add.graphics 0, 0And I drew lines on it @pathGraphic.lineStyle 1, 0xddd000, 0.75@pathGraphic.moveTo 2, 5@pathGraphic.lineTo 22, 55I need to clear it out and draw new lines on it. How do I do that? I don't want to delete it and create a new one, that's probably a waste of memory. Am I using the right thing to be drawing lines? Most of the methods I'm using aren't even in the documentation for Graphics http://docs.phaser.io/Phaser.Graphics.html Why is that? (Sorry for the code not being Javascript, but I think you get the point)
  22. Space Flight Hi! We just finished up another game, this one is called Space Flight. Use your finger to trace a path from incoming ships to the appropriate colored stations. As the game progresses, you will get more ships, stations, and unique upgrades that make managing your space port easier, but more challenging at the same time! Manage the universe's busiest space station! Help Mr. Warply figure out how to land all the ships coming to land at his stations. Several different stations, ship colors and additional challenges await you as you progress! Can you master this skill? Plea
  • Create New...