View Full Version : Javascript Map

11-30-2012, 09:13 PM
This is for some inspiration for whomever it may help. I decided to try to make an isometric game map with some 3d aspects to it. This is what I came up with so far.


Basically, the whole map is just made up of javascript. I made the initial map1, and map2 divs inside the play area tag. Map 1 is the basic floor tiles, map 2 is for 3d boxes and other things. It sits right on top of map one.

Using javascript, I checked each array and told it whenever it was a specific number in the map 1 and map 2 arrays to create a new element and assign a specific ID to that div giving it a specific background color or image.

For the boxes, I just took the tile div and said when it checked the array, and parse and integer that was 6, create 3 divs and i then skewed each div in css3 to make them take each side of the polygon which created the 3d box.

Tell me what you all think about it. I'm doing all of this just to better understand javascript and so on. I say that in the past 2 months i have progressed alot!

12-01-2012, 12:08 AM
It looks good :thumbsup:

Please add a DOCTYPE declaration to your page, and use of new Array() is discouraged:

var mapArray= [
Use of setAttribute is also discouraged:

tile.setAttribute('id','grass'); // prefer direct access..
tile.id = "grass";
It is also preferable to set attributes/properties of a new element before appending it to the DOM.

BTW These are not criticisms (apart from the DOCTYPE!).

12-01-2012, 12:30 AM
Thanks for feedback. I couldn't remember how to do it without using set attribute . My class I'm in tells me set attribute is ok though to use .

Also, I forgot to use doctype because when I test stuff I just forget to do that stuff. Otherwise what do u think?

12-01-2012, 12:35 AM
Last thing is pretty sure the "new array" thing is ur preference. I don't get errors when validating

12-01-2012, 01:00 AM
Last thing is pretty sure the "new array" thing is ur preference. I don't get errors when validating

It is not just (http://javascript.crockford.com/code.html) my preference, but there is nothing wrong, or invalid, in using 'new Array()'. There is a performance advantage in [] (I understand) but it is not significant in most circumstances.

12-01-2012, 01:21 AM
Oh ok that makes sense. I don't know how it would be performance wise but withou webgl a 3d game could be made. I know this jus by looking at the walls I made.