A new feature of HTML5, allowing Javascript apps to have a drawing surface in the browser.
0
votes
2answers
56 views
How can I move an object around a canvas in a random direction at random times?
I am currently trying to move an object (circle ball) around the canvas in a random direction.
I have already written the code for the wall collisions so the ball bounces back into canvas when the ...
1
vote
1answer
53 views
How should I efficiently clear and redraw my canvas with lots of animated sprites?
My current solution is to clear the entire canvas and redraw all sprites on every requestFrame(). This works but feels inefficient:
I only need to clear the part of the canvas made invalid by ...
0
votes
1answer
15 views
Mousedown event not performing drawImage
I've been working on the basic gameplay. I'm to a point where I think it should draw a card in the quadrant clicked/tapped, but nothing is happening. I can't see what's wrong. Please help. My only ...
0
votes
1answer
37 views
Why are my canvas drawings larger than the actual image?
For the following page source, I've finally gotten a grip on rendering the cards. I'm puzzled why they appear about 2.5x larger on the canvas.
<html>
<head>
<style>
...
0
votes
0answers
27 views
How to display a lot of small objects using WebGL?
Introduction
The game scene contains a lot of 10x10 pixel elements: for 1980x1200 px. screen the number of elements on the scene can vary from 0 to 23760 (elements cannot intersect).
The live ...
0
votes
1answer
27 views
HTML Canvas Makes Everything Bolder On Right Side
For some strange and sudden reason, my canvas seems to make lines thicker and darker on the right ~1/4-ish. I have tried multiple browsers and different computers and they all have the same rendering ...
1
vote
1answer
23 views
how to follow(center) a box inside canvas element
If inside a canvas I draw a box, and the I add arrows to move it, the box will eventually be out of my reach since it goes out the border and I cant see it. How could I follow the box so that it is ...
4
votes
1answer
113 views
Fixed Time Step Flutter
I've seen a lot of questions about this problem, but really no solution. Hopefully I can explain the issue well enough that I can get some sort of closure on this problem.
I'm using a Fixed Time ...
0
votes
0answers
53 views
Using canvas graphics instead of traditional sprites in phaser
I'm trying to learn Phaser (total beginner with mild JS experience) and I'm following tutorials and such where everything is using sprites. I'm trying to get by with basic canvas shapes instead of ...
0
votes
0answers
52 views
How to get the angle an object is travelling at
I'm trying to figure out how to get the angle an object is moving at, but have ran into a few problems. My player object is moved by rotating the entity left and right by using the left and right ...
3
votes
0answers
51 views
Check if a point is touching a user drawn curve in HTML5 canvas
I am having trouble detecting whether a ball is colliding with a red curve. The curve below is an example of what a user may draw on to the canvas. I can't think of any fast ways to detect collision ...
1
vote
0answers
58 views
Drawing a hexgrid on a canvas, yet making it zoom/scrollable?
I'm developing a game in JS / PHP. The game is basically a 2D plane (hexgrid) where each hex represents a location in space.
In total, I'm drawing 25 * 25 hexes on a 1000x1000 canvas. I also draw ...
2
votes
0answers
34 views
Best practice/way for client to speak with server
I'm making a multiplayer game in HTML5 Canvas and Node using Express and Socket.io. It's a platformer style game and so far the players are able to see each other and move around on the screen. It ...
1
vote
1answer
45 views
Javascript canvas check if all recs on the screen overlap a new one
So I know the AABB collision detection formula, however, this code does not work. Whenever I press space, a new square pops up. But this new square can spawn inside another, something that I do not ...
1
vote
0answers
34 views
Facebook Canvas (web) Game for Desktop & Mobile Browsers
as the title suggests - I am about to develop a game for FB canvas.
Will the game support mobile and desktop or do I have to create two different project/game setups for this?
thanks
1
vote
1answer
106 views
How do I check if one square is overlapping another in HTML5 canvas
I have a little program that goes like this:
Whenever somebody presses space, a blue square appears. The blue square shouldn't overlap with any other blue square.
But the function that is checking ...
5
votes
2answers
92 views
Create.js CPU High load
I'm new in Create.js and I'm trying to make countdown progress bar.
I have this simple code:
var stage = new createjs.Stage("timerCanvas");
stage.canvas.width = ...
1
vote
1answer
166 views
Android canvas.drawColor throws a null object reference
I have two nearly identical methods, the first to draw a splash screen while assets are loading, and the second to draw all of the assets to the screen. The first throws a NullPointerException on ...
6
votes
4answers
346 views
Rotating sprite around another sprite
I am building a pool game, and I want to make the cue rotate around the white ball.
Here is the live code:
http://199.26.84.223/nocol.html
Here is the code for the white ball:
balls = ...
1
vote
1answer
370 views
Building a simple bomberman game with Node.js and Socket.io [closed]
I'm building this game mostly because I want to experiment with Node.js and Socket.io, and the game is more like a proof of concept.
To start with, I have a 2D grid system as the game map.
...
0
votes
1answer
41 views
What determines the hit detection ordering for graphic elements in Unity (2d game)?
I have a bunch of overlapping buttons spread across several UI Canvases. The default mouse behaviour only registers hover/click events with one of the overlapping buttons, which is ideal for my ...
0
votes
0answers
23 views
Performance slows down on click event
I'm currently working on a game in node using socket.io and drawing onto canvas. I'm noticing that when I click during the game, character movement slows to a crawl.
For context: I'm updating x,y ...
2
votes
0answers
69 views
tilting image for mode7 game in HTML5
I'm making a mode7 game like mario-kart and I need to tilt the image before I draw it, I have tried using a buffer canvas to tilt the image then draw it on the games canvas but this makes it laggy ...
1
vote
3answers
793 views
Why does a UI button that is child to a canvas not appear in game view?
I am trying to place a button onto a canvas background using C# script.
I want the button specific to the canvas (i.e., if I move the camera to look at another canvas, I do not want the button ...
1
vote
1answer
453 views
JS Canvas - Creating 2D Game lighting effect like Terraria
I just started working with canvas in HTML5 and with javascript. I'm pretty satisfied with my game so far: http://xenopal.dk/game-v1.1/. But I'd like to implement lighting as well in the style of ...
1
vote
1answer
138 views
Drawing/adding shape objects with the mouse on html canvas
I've started with the canvas paint tutorial from link which worked fine with a few problems that can be fixed later. I've been checking a lot of posts on drawing shapes on the canvas but they all use ...
3
votes
1answer
172 views
Creating HTML5 Canvas Objects in Javascript [closed]
I'm currently trying to learn how to make HTML5 Canvas games with JavaScript. I would like to use object oriented JavaScript to manage the elements of the game, but i'm having trouble. I've done a lot ...
-2
votes
1answer
58 views
How do I clear the previous frames of a canvas animation?
I am trying to rotate an object, but all the previous frames still show up on the canvas. Here is my code.
This didn't work:
this.ctx.clearRect(0, 0, this.canvas.canvasWidth, ...
0
votes
1answer
70 views
android canvas rope swing
I'm creating the code, where a player swinging on a rope
for the moment I got this
double angle = Math.atan2(player_y - center_y, player_x - center_x) - Math.atan2(end_y - center_y, end_x - ...
1
vote
0answers
33 views
Donut-shaped / inverse mask in Phaser
I am trying to get a donut-shaped mask in Phaser (essentially the inverse of a regular mask). The mask shape is dynamic so it needs to be a Phaser.Graphics polygon object.
Desired result:
The blue ...
0
votes
0answers
69 views
UV texture mapping with perspective correction works for 50%
So, I've been trying to get the UV texture mapping down with perspective correction.
The triangle rasterization seems to work. The interpolation seems to work too. It's just the perspective ...
2
votes
1answer
85 views
Tiled - move all tiles
I'm making a map in Tiled.
I quickly ran out of room in the north of my map and would like to "shift" the tiles down. I'd prefer not to have to redo each of the tile layers.
Is this possible?
This ...
1
vote
1answer
45 views
Why can't CSS Sprites handle vectors?
Almost all the documentation available either says that "sprites are bitmaps" or that "css sprites must be bitmaps". Is there a specific reason for this? Is it, in fact possible to create a css sprite ...
0
votes
0answers
421 views
How to draw my android Hexagons in a grid?
I am trying to create a hexagon grid using the Android ’Canvas’ package. I have a working
’Hexagon’ class that when used in a view will draw a single hexagon on screen. The problem
is that I need many ...
1
vote
3answers
168 views
Javascript 2D top down handling player direction graphics
In my top down game I can move the character around and the character will even face the direction he is moving however there is some weird behavior I'm having when you hold down one direction and ...
4
votes
1answer
267 views
Roguelike 2D Collision Detection
I'm just a normal guy trying to do some basic collision detection but I suck at it. I either get stuck in a wall or I go in reverse in the wrong direction trying to update the player position to a non ...
-1
votes
1answer
143 views
Adding obstacles & collision to canvas game
I am trying to add some obstacles to the canvas game that I've got but something seems to be wrong and I can't seem to put my finger on it.
I just want some simple walls here and there to make the ...
0
votes
0answers
185 views
2.5D platform Android Game
I am a beginner to game development, so far I just made a top/down scroll shooter with canvas in Android, and I now wanto to make a 2.5D platform game like good old SNES, I am thinking of making it ...
1
vote
1answer
150 views
svg spaceship game movement 2d
I've been searching for a way to make an svg box move to all directions using js. I have seen many tutorials on how to do it grid like, but I want it so have a square that can turn, move forward, ...
3
votes
0answers
259 views
Card Masking in Phaser
Good Day,
I'm new to Phaser and still learning about it to.
I am challenging my self to create a simple animation of a card flip somewhat realistic
rather that making use of a scale.
This is ...
0
votes
1answer
55 views
Rectangles clear each other when moving on canvas
I am having this problem after moving rectangles, they seem to delete one another.
Most probably it is a problem with clearRect(...) method.
This is the clean function I am using:
clean: ...
1
vote
0answers
27 views
CocoonJS draws shadow around tiles
I am using CocoonJS launcher on iOS for a simple tiled game. Calling canvas drawImage for tiles adds a shadow or ghost border around tiles. See this screenshot:
...
1
vote
1answer
488 views
Cocos2D-JS Windows App in fullscreen mode (Win32)
I've been looking for a way to make my Cocos2D-JS app go into fullscreen mode, but there doesn't seem to be much documentation on Cocos2D-JS (or Cocos2D-x-js as some seem to call it.)
This app is to ...
0
votes
0answers
70 views
Collision detection in JavaScript Canvas game - Issue with 'if' statements [duplicate]
I am currently developing a simple browser-based game and seem to be on the cusp of collision detection that doesn't just return the player to where they were before, but actually will slide them ...
3
votes
1answer
318 views
How can I create 2D, sprite-based reflections in HTML5 Canvas?
I'm trying to create simple reflections in a 2D, sprite-based game using HTML5. I'm looking to recreate an effect like the one you'd often see in GBA games, such as Pokemon Emerald and Mother 3:
...
1
vote
1answer
996 views
Rotate arrow on canvas
I need to draw a flow dynamically based on some user choices. In that flow I want to draw the choices (blue circles with number) and the directions of that choices (line and arrow). For example: node ...
0
votes
1answer
394 views
How to draw small sprite bigger?
I have created an image with the resolution of 25px(width)*34px(height) (I know it's unusual, however it doesn't bother me now). The problem is that when I try to display it by creating a bitmap, it ...
0
votes
0answers
29 views
Reverting 2d canvas?
I'm making a multiplayer game which involves drawing lines. It's based this game: http://curvefever.com/sites/default/files/resize/remote/ef86488088c618df13b34f8b87aafd4e-1107x808.jpg. The game is ...
3
votes
1answer
229 views
How to implement user friendly screen panning on 3D HTML canvas for RTS game
How can I get RTS map panning like how it was done in C&C red alert (with the mouse at the edge of the screen moves the screen in that direction) with a Babylon.js RTS game in the html canvas? ...
3
votes
1answer
789 views
Why would it be faster to render using multiple canvas elements?
This video suggests that rendering using multiple canvas elements helps performance.
How does this work?
The idea was to use one for the player, one for the enemies, another for the background, ...
