I've made this little rpg ruby game I did while learning and now I'd like to make it into a browser game. I've already set up Sinatra framework to serve it, so what I am looking for, before everything else, is a way to represent the game map in browser (location attributes are stored in db).

A new map is randomly generated by code for each new game at each game start. For now forget db, and let's say a map (say 100x100 "squares") is stored as a tridimensional array. (x,y, ...) Last "dimension" of array stores who & what is at that map cell: a player, a building, whatever. So all I have to do is render those "squares" or array cells to a 2d tiled map in the browser.

The map does not need to refresh or be dynamically fetched as you scroll it, (at least at this stage of development) but, a technology which would allow me to do so in future would be a good reason for choosing it.

Things that I thought of: html tables, html5 canvas, some js framework which is designed exactly with this purpose (which I do not know of = please advice).

Yes I know about gamequery-js framework, but I've never used it, and I don't know if it's going to slow down everything down to inusability as I'm adding new features (scrolling, ajax).

I really don't know of any other alternatives.. maybe there are lighter approaches? Easier or more minimalistic ways ? More targeted js framework which is the right tool for the job? Maybe just some html canvas code, or even simple image maps, or images with absolute positioning will be enough?

The thing is I'd like to start simple, and then gradually make it better, so, as I said before, I'd prefer something that will give me room for improvement or is headed toward new web tendencies but which will also give me a bit of gratification in the beginning :)

So.. advices are needed! And appreciated! :) Thanks

p.s. Flash is excluded because I don't like it.