HTML 5 refers to new web technologies such as high performance JavaScript engines, canvas 2D and WebGL, video and audio tags.

learn more… | top users | synonyms

4
votes
2answers
946 views

Optimizing isometric drawing function

I need help optimizing my Draw(); function to draw only what is visible in the viewport. Currently I'm drawing the whole Map array in a diamond shape. How can I make my function store only what is ...
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 ...
0
votes
1answer
512 views

Z axis in isometric tilemap

I'm experimenting with isometric tile maps in JavaScript and HTML5 Canvas. I'm storing tile map data in JavaScript 2D array. // 0 - Grass // 1 - Dirt // ... var mapData = [ [0, 0, 0, 0, 0], ...
1
vote
0answers
305 views

Open Source HTML/JS game(s) with license that would allow embedding in my app? [closed]

I'm working on an educational app for kids. At the end of the sign-up process, the kids must wait for a confirmation from their parents in order to gain access to the app. While they wait for this to ...
-3
votes
3answers
266 views

Game getting progressively laggier?

I have a small game in HTML5 that uses socket.io to communicate with a node.js server. Now my problem is that, ever since I did my last update on it it seems to have something "chunk up" in the ...
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 ...
0
votes
2answers
1k views

Lighting effects with 2D sprites

I would like to know how to best achieve lighting effects with 2D. I guess the only way is to make sprites of the area to be lit in specific colors? Say I have a streetlamp, and around this place ...
2
votes
2answers
1k views

Architecture for html5 multiplayer game?

Hello I want to write a HTML5 multiplayer game in which there are rooms with two players answering a series of questions with 3 possible answers, 10sec/question, which are being downloaded from a ...
1
vote
2answers
770 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 ...
1
vote
1answer
746 views

How do I go from a simple html5 tic tac toe game to an online 2 player game?

I've been working on an online 2 player Tic Tac Toe solution for blackberries. both old and new. And so far I have html5 code that has a 3 x 3 layout that switches between x and o for the game ...
1
vote
1answer
494 views

A* Start path finding in HTML5 Canvas

I'm trying implement A* Start path finding in my games(which are written with JavaScript, HTML5 Canvas). Library for A* Start found this - ...
7
votes
2answers
317 views

What is the standard way of delivering HTML5 games to portals and such?

Let me explain what I mean by "standard way of delivering"... Think about Flash games sites. Flash games can be delivered as a single file, either hosted by the site, or, I guess, provided by someone ...
1
vote
1answer
221 views

Calculate travel time on road map with semaphores

I have a road map with intersections. At intersections there are semaphores. For each semaphore I generate a red light time and green light time which are represented with syntax [R:T1, G:T2], for ...
4
votes
6answers
738 views

Should I refer to browser-based games as HTML5 games or Javascript games?

First of all, I know that there are alternatives to both HTML5 and Javascript, but I worded the question so generally ("browser-based") because if I had said "HTML5" or "Javascript" games that would ...
1
vote
1answer
185 views

Manually updating HTML5 local storage?

I'm just starting out HTML5 game developement (and game dev in general) and watching all the videos and tutorials available something has crossed my mind. Everyone keep saying I should set the ...
6
votes
2answers
2k views

Is there an ideal width to height ratio?

I would like to know if there is any "ideal" width to height ratio when creating games for the web. My canvas is fluid, and resizes according to the browser width and height. But with all the devices ...
2
votes
3answers
8k views

How do I structure a 2D platform level?

I'm doing a 2D platformer but I don't know how they are usually built. The approach I'm looking at is making it tilebased, with ground tiles on bottom row, then platforms on some places in "mid-air" ...
1
vote
1answer
246 views

How to perform efficient 2D picking in HTML5?

I'm currently using an R-Tree for both picking and collision testing. Each entity on screen has a bounding box for collisions and a separate one for picking. Since entities may change position very ...
3
votes
2answers
1k views

Essential 2D engine features [closed]

I have decided to make a simple engine for a new game I'm working on, and now, I'm wondering: what are the essential features of a 2D game engine? Or, a game engine in general?
0
votes
1answer
729 views

How to handle animations?

I am coding a simple 2D engine to be used with HTML5. I already have classes such as Picture, Scene, Camera and Renderer, but now I need to work on Animations. Picture is basocally a wrapper for a ...
0
votes
2answers
184 views

DrawImage doubt

What is the best option for animation in a game (HTML5 Javascript)? Put all the images in one png and change the background. Or create each image separately and draw with DrawImage?
6
votes
1answer
589 views

What is this JavaScript gibberish?

I am studying how to make a 2D game with JavaScript by reading open source JavaScript games and I came across this gibberish... aSpriteData = [ "}\"¹-º\"À+º\"À+º\"À+º\"¿¤À ~C_ ...
0
votes
2answers
519 views

how do i make the JS/jquery tic tac toe squares only clickable once?

As i have it now my script makes the 3x3 grid clickable, and I dont know exactly how to turn on the click once it has been clicked. This is using jQuery and a simple if else statement to switch ...
7
votes
4answers
4k views

Which image format to use for sprites in an HTML5 game?

In a 2D HTML5 game, what is the best image format to use and why? Should I use different formats in different situations? For example, .png for the background image, .jpeg for the animation frames and ...
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 ...
1
vote
1answer
531 views

Customize Colors for Sprites in Web Game

So I'm working on an html5/javascript/css3-based game. Without going into too much detail, I'm thinking of having the characters be simple 8 or 16-bit style sprites, but I'd like to allow the user to ...
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. ...
3
votes
3answers
1k views

HTML5 Canvas Game Timer

How to create good timer for HTML5 Canvas games? I am using RequestAnimationFrame( http://paulirish.com/2011/requestanimationframe-for-smart-animating/ ) But object's move too fast. Something like ...
1
vote
2answers
534 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
893 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 ...
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 ...
-6
votes
2answers
2k views

HTML5 Canvas game viewport

How to create in HTML5 canvas viewport? something like for tile maps.
1
vote
0answers
962 views

How to turn a 3d camera (in HTML5 2D Canvas)

A few years back I started experimenting with 3d in canvas. Everything went pretty well untill I had to to turn the camera, I couldn't get it done. A few days back I just happened to stumble upon ...
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. ...
6
votes
2answers
2k views

What would be a good game making engine supporting Vector images?

I want to create a simple platforming game, in which you are a square in a wonderful world. I would like this game to be able to be played in browsers. Basically I am searching for something similar ...
1
vote
1answer
796 views

How do I deploy my JavaScript/HTML 5 to desktop and smartphone?

I'm looking for framework that will let me code on JS for HTML5 canvas and then will let me deploy to desktop and Android. I'm not looking to learn new stuff like Haxe or Lua. I want to do it in plain ...
0
votes
1answer
526 views

3d js map rendering

In the past I've done a 2D tile map using HTML, CSS and Javascript. Now I have the task of creating a 3D version using the same technologies - think of it like a space map where all planets have x/y/z ...
3
votes
1answer
605 views

How to compute the 2D equations of 3D circular arcs?

I'd like to obtain these equations for the ellipses produced by the perspective projections of (3-dimensionally transformed) circles. This is useful for rendering in 2D contexts which provide curve ...
1
vote
1answer
872 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.." ...
3
votes
1answer
1k views

Shoot a bullet towards cursor - top down 2d

I am making a 2D topdown shooter game, in which the player's movement is controlled with WASD and gun with the mouse. I'm having a hard time figuring out how to update the position of the bullet as it ...
1
vote
2answers
2k views

Is it possible to convert file from Blender 3d to svg?

I want to build web game in html5 with canvas/svg. Can I convert/export file from blender to canvas/svg? Maybe via unity3d?
0
votes
1answer
1k views

Staggered Isometric Map In Javascript

I'm trying to create a staggered isometric map in Javascript. var x, y, row, column, top, left, width = window.innerWidth, height = window.innerHeight, tile = {width: 64, height: ...
3
votes
5answers
3k views

free web library for leaderboards / achievements [closed]

I would like to know if there is any free leaderboard libraries for web games developed in HTML5/JS (as openfeint is for iPhone, Android) I found this http://www.appmobi.com/, but it seems the ...
0
votes
2answers
698 views

Good book/resource recommendation for HTML5 mobile game development?

The problem: I am taking an existing, 5 year old, html based MMORTS game and "HTML5-ing" it, "AJAX-ing" it and most importantly, optimizing for mobile devices like iPhone, android etc. For these ...
0
votes
1answer
375 views

Scale DIV with tiles

I am trying to create a repeating background. I have a main DIV with a grid of small 16x16 DIVs. I am trying to scale the main DIV in CSS; when the small DIVs simply have a red background color ...
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 ...
3
votes
3answers
585 views

What is better for the overall performance and feel of the game: one setInterval performing all the work, or many of them doing individual tasks?

This question is, I suppose, not limited to Javascript, but it is the language I use to create my game, so I'll use it as an example. For now, I have structured my HTML5 game like this: var fps = ...
6
votes
3answers
825 views

How can I tweak this A* search pathfinding algorithm to handle different terrain movement values?

I'm creating a 2D map-based action game with similar interaction design as Diablo II. In other words, the player clicks around a map to move their player. I just finished player movement and am moving ...
1
vote
1answer
453 views

How can I render player movement on a 2d plane efficiently?

I'm prototyping a 2d HTML5 game with similar interaction to Diablo II. (See an older post of mine describing the interaction here: How can I imitate interaction and movement in Diablo II?) I just got ...
1
vote
0answers
440 views

Good practices when optimizing HTML5/Javascript Game Developement [closed]

I'm just starting out as a game developer and have created a few crappy but playable clones of classic games like pong, and bomberman. Being self taught (bless the internet) I do this by just stuffing ...