A new feature of HTML5, allowing Javascript apps to have a drawing surface in the browser.

learn more… | top users | synonyms

-2
votes
2answers
80 views

canvas graphic output doesn't work [closed]

at the moment i'm developing a 3D-Vector-Coordinates-to-2D-Canvas-Calculation. the code is ready, the canvas too, but something doesn't work right... You can find my code at ...
1
vote
1answer
313 views

Recreating Doodle Jump in Canvas - Platforms spawning out of reach

I have started to recreate Doodle Jump in HTML using Canvas. Here's my current progress. As you can see, if you play it for a few seconds, some platforms will be out of the player's reach. I don't ...
3
votes
2answers
4k views

Smooth animation on a persistently refreshing canvas

Yo everyone! I have been working on an Isometric Tile Game Engine in HTML5/Canvas for a little while now and I have a complete working game. Earlier today I looked back over my code and thought: ...
5
votes
1answer
1k views

Javascript Canvas Drawing Efficiency

I have just recently started some experiments with game development in Javascript/HTML5, and so far it has been going pretty well. I have a simple test scene running with some basic input handling, ...
8
votes
2answers
6k views

Free movement in a tile-based isometric game

Is there a reasonable easy way to implement free movement in a tile-based isometric game? Meaning that the player wouldn't just instantly jump from one tile to another or not be "snapped" to the grid ...
2
votes
0answers
81 views

How to work with edge Texture [duplicate]

Im not sure if i use the right terms, but im not able to find something to start with. Im trying to develop a little HTML5 game. I have a ground with a texture and now I want to make a surrounding ...
1
vote
3answers
2k views

Android, how important is deltaTime?

Im making a game that is getting pretty big and sometimes my thread has to skip a frame, so far I'm not using deltaTime for setting the speed of my different objects in the game because it's still not ...
7
votes
2answers
1k views

android multitouch problem

Im aware that there a a couple of posts on this matter, but Ive tried all of them and none of them gets rid of my problem. Im starting to get close to the end of my game so I bought a cabel to try it ...
0
votes
1answer
675 views

Why does my health bar disappear whenever my character takes amage?

Im making health bar for my game that looks like this: public void healthBar(Canvas canvas) { float healthScale = happy.getHP() / happy.getMaxHP(); Rect rect = new Rect(20, 20,(120 * ...
3
votes
2answers
6k views

how to solve ArrayList outOfBoundsExeption?

Im getting: 09-02 17:15:39.140: E/AndroidRuntime(533): java.lang.IndexOutOfBoundsException: Invalid index 1, size is 1 09-02 17:15:39.140: E/AndroidRuntime(533): at ...
-2
votes
1answer
773 views

Direction of the bullet - how to have something else than left, right, top, bottom

I'm making a simple shooter game using canvas and javascript. The current code can be seen here. To know which way I want the bullet to be shot, I simply have a direction property that can have 4 ...
1
vote
2answers
1k views

Calculating angle between two vectors to steer towards a target

I have been trying to implement a path following steering behaviour for AI in a 2D racing game. I have two vectors: futurePosition represents the predicted future position given the car's current ...
0
votes
2answers
629 views

Platformer movement and collisions

I'm working on a platformer but I'm stuck at the player movement and collisions. Right now I'm not including the grid at all in the movement, but it's time I do it. I've read this article on how to ...
43
votes
7answers
3k views

Managing text-maps in a 2D array on to be painted on HTML5 Canvas

So, I'm making a HTML5 RPG just for fun. The map is a <canvas> (512px width, 352px height | 16 tiles across, 11 tiles top to bottom). I want to know if there's a more efficient way to paint the ...
2
votes
3answers
2k views

Text fields in a java canvas

So I'm trying to have some form of input in my game and I understand all the keyPresses and whatnot but the only issue is I have no idea of adding a textfield to the game. JTextfield doesnt seem to ...
2
votes
2answers
1k views

Javascript Isometric draw optimization

I'm having trouble with isometric tiles drawing. At the moment I got an array with the tiles i want to draw. And it all works fine until i increase the size of the array. Since I draw ALL tiles on ...
1
vote
1answer
2k views

JavaScript rendering: Canvas or DIV?

I am planning on developing a multiplayer RPG (kinda like RuneScape, but don't worry, with a different gameplay) and i want to do this in the browser. Now before saying things like "A MMORPG is hard ...
1
vote
1answer
1k views

HTML5 Canvas Depth Sorting

I'm have problem with Isometric. I'm don't know how to name this "problem", but I'm show you some sceen what I get and what I'm need to get. My code now drawing something like: ...
1
vote
1answer
3k views

Easy way to do gravity in a simple game?

I'm looking for an easy, beginner friendly way to do gravity in a platformer. I've looked into Box2D tutorials, but they all seem very complicated. All I want is a class that takes into account if my ...
1
vote
3answers
1k views

2D maps, how to structure?

I'm new to this. And I don't really understand 2D tile maps. The tutorials I've read use arrays, but doesn't this get really difficult to manage when they get big? And what if I want different ...
6
votes
1answer
2k views

HTML5 Canvas Converting between cartesian and isometric coordinates

I'm having issues wrapping my head around the Cartesian to Isometric coordinate conversion in HTML5 canvas. As I understand it, the process is two fold: (1) Scale down the y-axis by 0.5, i.e. ...
1
vote
2answers
784 views

Multiple setInterval in a HTML5 Canvas game

I'm trying to achieve multiple animations in a game that I am creating using Canvas (it is a simple ping-pong game). This is my first game and I am new to canvas but have created a few experiments ...
16
votes
8answers
11k views

How should I sort images in an isometric game so that they appear in the correct order?

This seems like a rather simple problem but I am having a lot of difficulty with it. What should I do to properly sort images in an isometric game? In a normal 2d top-down game one could use the ...
2
votes
2answers
367 views

how to transform child elements position into a world position

I'm making a 2d space game in Javascript with canvas. In this game there's a bunch of spaceships, positioned in world space, with turrets, positioned relative to their parent ships. These objects also ...
0
votes
1answer
415 views

How to select an image on the J2ME Canvas

I am working on J2ME. I have got a canvas, with a layout of a Checkers board. At the position of pieces, I have placed images. The point at which I got stuck is, how to select/highlite a piece's image ...
0
votes
1answer
1k views

HTML5 Canvas Tileset Animation

How to do in HTML5 canvas Image animating? I am have this code now: http://jsfiddle.net/WnjB6/1/ In here I am can add animations something like -> Animation.add('stand', [0, 1, 2, 3, 4, 5]); But ...
5
votes
4answers
2k views

Defining the track in a 2D racing game

I am designing a top-down racing game using canvas (html5) which takes a lot of inspiration from Micro Machines. In MM, cars can move off the track, but they are reset/destroyed if they go too far. ...
1
vote
2answers
549 views

Frustum Culling/Only rendering what's viewed by the Camera in HTML5 Canvas?

I coded up a simple 2D Camera for my HTML5 Canvas-Based Game Engine but I noticed the performance wasn't very good. So a lot of people suggested only rendering things that are shown by the camera but ...
3
votes
1answer
936 views

HTML5 Canvas fillStyle as numbers not text

When drawing vector graphics in the canvas you set the fillStyle using an rgba string like this... context.fillStyle = "rgba(255, 223, 191, 1)"; Is it possible to feed in a javascript object ...
3
votes
2answers
167 views

Deactivate keyboard input on collision

I'm creating an online-canvas-game with a tank as player object. Now I have several structures in my canvas, that shouldn't be able to be overdriven by the tank... My solution is to detect the ...
4
votes
2answers
2k views

canvas ball physics animation

I want to animate ball in html canvas like this. ctx.beginPath(); ctx.arc(75, 75, 10, 0, Math.PI*2, true); ctx.closePath(); ctx.fill(); start position is left top corner and ball's maximum ...
-1
votes
0answers
67 views

ball 2d animation [duplicate]

Possible Duplicate: canvas ball physics animation I want to animate ball in html canvas like this. ctx.beginPath(); ctx.arc(75, 75, 10, 0, Math.PI*2, true); ctx.closePath(); ctx.fill(); ...
13
votes
1answer
14k views

Multiplayer HTML5, Node.js, Socket.IO [closed]

I trying create simple Multi-player with HTML5 Canvas, JavaScript(too using John Resig simple Inheritance library) and Node.js with Socket.IO. My client code: var canvas = ...
1
vote
1answer
893 views

Converting coordinate systems to/from an isometric game world

I have tried searching and reading for an answer, but the information I could dig up either didn't fit what I need or was in the form akin to "Just multiply the vectors with the inverse matrix of.." ...
0
votes
1answer
1k views

How to display a tile map from a 2D array in JavaScript?

I have stored my map, but the problem I am having is displaying it. My map is 100x100 tiles which are 40x40px. I have my loop running through the array but I'm having difficulty selecting the portion ...
3
votes
1answer
2k views

Canvas tile grid, hover effects, single tilesheet, etc

I'm currently in the process of building both the client and server side of an HTML5, canvas, and WebSocket game. This is what I have thus far for the client: http://jsfiddle.net/dDmTf/20/ Current ...
1
vote
2answers
1k views

Matrix rotation of a rectangle to “face” a given point in 2d

Suppose you have a rectangle centered at point (0, 0) and now I want to rotate it such that it is facing the point (100, 100), how would I do this purely with matrix math? To give some more specifics ...
1
vote
2answers
3k views

Creating several instances of the same object, and selecting only one

I'm playing around with making a puzzle game, haven't done that much before I run into my first problem. I want to create a certain amount of the same object/function. But without hardcoding the ...
10
votes
2answers
630 views

Dirty 2D map rendering

I keep hearing people talk about "dirty rendering" when it comes to map rendering for HTML5. I've Googled and searched the GameDev about it but there isn't much about it. What exactly is it? How to ...
3
votes
0answers
260 views

Choosing a (browser) game environment [closed]

I apologise in advance if this post is something you've heard a million times already or seems like a trolling attempt. I just want some advice and I'm coming up short with my own Google searches. ...
5
votes
4answers
2k views

Making a startscreen for an HTML5 game?

How would I make a start screen for a game using HTML5 canvas? I'm not looking for something advanced, just the new game button and highscore link etc. The question might be stupid, but I've never ...
2
votes
2answers
1k views

Drawing isometric map in canvas / javascript

I have a problem with my map design for my tiles. I set player position which is meant to be the middle tile that the canvas is looking at. How ever the calculation to put them in x:y pixel location ...
3
votes
1answer
306 views

How do I show the current view from the viewport on my map?

I'm doing HTML5 Canvas development and currently have a large viewport (on the left) and a map (on the right). Like this: I need to show on the map what is currently being viewed in the left. And ...
2
votes
2answers
469 views

Collision Detection doesnt work because some things move more than 1px at a time

I'm writing a 2d scrolling game in javascript using canvas and since I'm limited to setInterval running at minimum once every ms, I need to have some objects moving at greater than 1 pixel a second. I ...
1
vote
1answer
283 views

Isometric Optimization in javascript

I'm having some issues with my optimization of my game. I have a simple tile map looped like this in my case the images are 64 by 64 pixels: for (i=0; i < 50; i++){ //horizontal for (j=0; ...
4
votes
2answers
683 views

HTML5 multi-player game data/event validation best practices

I'll start by saying that I am fully aware that this question might seem subjective at first, but I'll try and provide a specific test case scenario for it to be a clear question about validating the ...
1
vote
1answer
1k views

Android-Handling screen clicks for dynamically moving objects in a view

I have a kind of broad question to ask but I have to start some where so.....What is the best way to handle onscreen clicks for moving objects being drawn on a canvas in a view. Im registering the ...
2
votes
1answer
2k views

Collision detection between a sprite and rectangle in canvas

I'm building a Javascript + canvas game which is essentially a platformer. I have the player all set up and he's running, jumping and falling, but I'm having trouble with the collision detection ...
3
votes
2answers
4k views

HTML5 canvas screen to isometric coordinate conversion

I am trying to create an isometric game using HTML5 canvas, but don't know how to convert HTML5 canvas screen coordinates to isometric coordinates. My code now is: var mouseX = 0; var mouseY = 0; ...
3
votes
3answers
431 views

Commonizing cycle time across different browsers for HTML5

Is there a good (accepted) method for "fixing" the cycle time within an HTML5 canvas game implementation? The game that I have been working on runs far quicker in Google Chrome than in other browsers ...