Page 1 of 1

Map like new MMORPG Project

Posted: Wed Sep 23, 2015 11:52 am
by mattollie
Hi Guys,

I have been trying to modify the map that has been used in the latest mmorpg video tutorials but am having issues.
The map idea I am going for is below.
Snippet coppied from Outwar.com.....

Looking at the code its pretty similar to the new tutorials.

I know im noob, but any help is appreciated.

Code: Select all

<body>
  <table cellspacing="0" cellpadding="0" style=
  "background-color:#333333;border:2px solid black;">
    <tbody>
      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"><img src="/images/maptile/YAH.gif" style=
        "margin-top:10px;" /></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest1.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>

      <tr>
        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#333333;background-image:url(/landing/defroom.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>

        <td style=
        "text-align:center;vertical-align:middle;color:white;background-color:#6F552F;background-image:url(/images/forest/forest4.gif);">
        <div style="height:29px;width:29px;"></div>
        </td>
      </tr>
    </tbody>
  </table>
</body>

Re: Map like new MMORPG Project

Posted: Sun Sep 27, 2015 1:26 pm
by mattollie
anyone???

Re: Map like new MMORPG Project

Posted: Sun Sep 27, 2015 2:50 pm
by KyleMassacre
I dont understand exactly what you are wishing to accomplish. Can you give a bit more detail?

Re: Map like new MMORPG Project

Posted: Mon Sep 28, 2015 4:30 am
by mattollie
Hi Kyle,

Sure thing.
Sorry about my noobness in this.
I am a VB.Net developer and have dabbled with Java and HTML / PHP

What I'm trying to accomplish is something similar to Halls new video tutorials where you can click the buttons to move your character around a square map.
However in his map, there are mining / woodcutting and all that stuff.

I'm looking to create a simpler map without all the mess with mining and stuff, but more each movement (up, down, left, right) is a room and in that room there are creatures that can be attacked.

The map is probably the hardest thing for me to understand.
The example I have given above is what is being used in a game called Outwar.

If you paste that code into a text file, name is .html and run it, you will see an outline of rooms (Dark squares are the border where you cant go and the light squares are rooms you are allowed to move to)

This game was one of my favs back in the day but it is really outdated and old.

Example below

Red Dot is character

Starting Room
Image

Click Right Arrow (Moving to the right)
Image

Click Right Arrow Again (Moving to the right)
Image

etc, etc

Let me know if you need more info and ill try and explain as best as possible.

Re: Map like new MMORPG Project

Posted: Wed Sep 30, 2015 1:20 pm
by hallsofvallhalla
So what exactly is the error you are getting or the issue causing trouble?