Tagged Questions

22
votes
12answers
10k views

Isometric game engine in JavaScript/HTML5 [closed]

Is anybody aware of any stable-ish (ie out of alpha) isometric drawing engines for JavaScript/HTML5? I have done some Google searches and found a few, but they were mostly in alpha/invite-only ...
0
votes
2answers
509 views

HTML5 - Does it have the power to handle a large 2D game with a huge world? [closed]

I have been using XNA game studio, but due to private reasons (as well as the ability to publish anywhere & my heavy interest in isogenic engine), I would like to switch to HTML5. However, I have ...
5
votes
5answers
1k views

Best technique for drawing isometric tiles

I'm thinking about making a simple isometric game with HTML5 Canvas, and wondering what's the fastest way to render the tiles. Since the tiles are diamond shaped, but drawImage draws rectangles, I ...
0
votes
1answer
380 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], ...
-4
votes
1answer
303 views

Smooth scrolling a staggered iso map [closed]

I got a staggered iso map that I want to be able to drag scroll with the mouse. I have it almost working but it is a bit glitchy, especially near the borders. Maybe you have an idea how to fix that. ...
8
votes
2answers
2k 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 ...
4
votes
1answer
513 views

Smooth drag scrolling of an Isometric map - Html5

I have implemented a basic Isometric tile engine that can be explored by dragging the map with the mouse. Please see the fiddle below and drag away: http://jsfiddle.net/kHydg/14/ The code broken ...
2
votes
2answers
680 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
424 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: ...
4
votes
2answers
479 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 ...
5
votes
1answer
705 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. ...
13
votes
8answers
4k 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 ...
0
votes
1answer
452 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
634 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: ...
7
votes
2answers
1k views

Is there a simple way to do true isometric projection with an HTML5 canvas?

Is there a simple way to get a true isometric projection with the HTML5 canvas element?
3
votes
3answers
2k 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; ...