Would make a map 100x100 in size, and you access the values of the map this way: map[x][y]. All the values are initially set to 0.
Then I would perhaps make an array for the tiles:
var tiles = array();
tiles = (Some reference to the image tile, attributes, etc that you need, 0 being 'nothing', 1 being 'grass', 2 being flowers, etc.)
Point is to make a list so that each value in the map array directly maps to the index of the tile table. Example: if map returns '4', its tile is retrieved using tile.
Just to flesh out my immediate idea.
For your movement, you could have a position x, and y for your character. You also have values for the visible width and height of the visible position of the screen in number of visible tiles, and the top left corner position of this rectangle in the map.
You have a map sized 100x100. You are positioned at 30x60. The visible width and height is 21 tiles in each dimension, making you see 10 tiles ahead in every direction, not counting the spot you are on. This makes all my coordinates inclusive start and end, meaning that a range from 20 to 40 means 21 tiles. (20 = tile 1, 21 = tile 2 ... 39 = tile 20, 40 = tile 21)
You would then start drawing the map at positions x = 30 - 10 = 20, y = 60 - 10 = 50, and end at x = 30 + 10 = 40, y = 60 + 10 = 70, but you need to check the borders so you don't go past the size of the array in either direction in x and y.
You have to decide on:
1. The character must always be in the centre: this means the border of the map somehow must be allowed to move to the centre.
2. The character is allowed to move around on the map freely without being in the centre, and that moving beyond a certain point bumps the map one or more tiles. This allows the map border to never be drawn inside the visible area, and the character to move all the way to the edge of the screen, when the character reaches the end of the map.
3. Make enough bushes and mountains to never allow the border of the map to come inside of the screen.
Sorry if I am not clear enough, I just brainstormed a bit here. Just ask if anything is unclear.
I am not sure if this is the best way, but you get the idea. If you want to see the details how I did something similar, view the source code of:
I even started on a tile editor once that I never finished because I needed to do some major restructuring to make an effective GUI in JS:
(And I really consider myself a n00b...)
Ah Thx for the Replys Im very Thankfull for your feedback and im Sorry that i haven't replied back in such a long time. Been to busy with Work and my Personal Life.
Anyways to the code, i been trying out the things you been telling me and it seems to quite frankly work properly. I will continue evolving the game and will contact you if there are other types of questiones i have.