• Advertisement
  • Popular Tags

  • Popular Now

  • Advertisement
  • Similar Content

    • By Josheir
      I am going to use/learn JavaScript once a week.  I am wondering what the best backend for a store/login game server/etc. would be :  PHP or C#, or something else.  The criteria is longevity of uses, efficiency, value, and quickness to learn. 
      Am I forgetting anything that would be needed, i.e. : the unresearched :  JNode.  I want to be lean with my learning.
      Thank you; it has taken quite a while to consider all this,
      The language that I know the best is C++.  I will be using/studying this more too (other days.)
    • By Jiraya
      For a 2D game, does using a float2 for position increases performance in any way?
      I know that in the end the vertex shader will have to return a float4 anyway, but does using a float2 decreases the amount of data that will have to be sent from the CPU to the GPU?
    • By ThunderTwonk
      Hello everyone, I am working on a game idea and since I am still in the process of learning C# and the features available in unity I was hoping some of you might be able to offer me a little insight on things in general for getting started.
      I guess the basic components of what I'm wanting to create would be a Multi-levels management/city builder/rpg.
      The goal is to provide a framework for players to interact with, build in and affect the world both from a 3rd person action RPG as well as a zoomed out 4x style view (This would be something unlocked through gameplay)
      As for my questions go I was wondering if anyone had resources that could help me learn.  I've been on youtube as well as enrolled in an online course for basic unity and C# and will continue those but if anyone has any words of advice, a place that has good information and tutorials etc.
      Thanks for your time.
    • By INFRA
      SCAN. DRILL. SURVIVE.   ISOLATED Release in May 1st 2018   https://store.steampowered.com/app/805950/Isolated/   A game by Jérémie Bertrand Music & Sound Design by Pierrick Querolle *** Our solar system has been invaded by strangers. For the purpose of a possible negotiation, a team of astronauts is sent to the moon. Alas, they are shot before even arriving on the scene. Only one astronaut survives the crash and his only goal will be to go home...   GAMEPLAY   Shoot enemy ships to avoid being invaded. Be precise in your movements, because it's better to lose a bit of life at the top than to lose it all at the bottom. Take out your drill to destroy the stones in your path. Validate your identity to cross the different laboratories. Reach the flag before losing your three lives.   And all that... at the same time! Will you be able to go home? If the answer is yes, how long will it take?
    • By Captain Jack
      Two questions: I am trying to rotate chroma in YUV colour space by separating each of the components and applying the following formula.
      int Ut = ((U-128) * cos(hue[H]) + (V-128) * sin(hue[H])) + 128; int Vt = ((V-128) * cos(hue[H]) - (U-128) * sin(hue[H])) + 128; ...where hue[H] is an array of rotation angles between 0.0 and 360.0.
      This seems to work OK but is dog slow. Is there a way to speed this up by converting to integer only calculation and doing away with cosine and sinus? 
      Second, when doing conversion between YUV and RGB, it seems that luma is also affected after rotation. To demonstrate what I mean, I am randomly rotating each line's chroma. The process is:
      Convert from RGB to YUV > rotate chroma > convert to RGB.

      Top left is the original image, the two images on the right are U and V and the bottom left is the luma. As you can see, it seems to have some artefacts from rotation. Is there a way to avoid this?
  • Advertisement
  • Advertisement
Sign in to follow this  

HTML5 Tiled Map - drag & click

Recommended Posts

Hello, what I need to achieve is very simple HTML5(and Jquery)  draggable tiled game map with players on it(for my mmorts), like the ones below. I'm not asking for someone to make it for me, just need some directions where to start and what to use(since my game has database should I use it for the map too?). Also I need to click on players's castles, but I think in canvas this is not possible.

I want the map to be big, about 25000x25000px, but rendering that big image all at once would not be the way, obviously.

EDIT: Can someone move this topic to beginners section, i think posted it in wrong place.



Edited by hotsaucebg3

Share this post

Link to post
Share on other sites
On 7/14/2017 at 11:23 PM, hotsaucebg3 said:

Also I need to click on players's castles, but I think in canvas this is not possible.

Why would it not be possible?

As long as you can get some kind of click event and a mouse position clicking something in a game is basically possible in any medium.

Share this post

Link to post
Share on other sites

If you dont want to use a external editor, you can simply write your own.

In Javascript this is a piece of cake, especially with HTML5 and Canvas.


- Just define a tilemap array, a tilesize and a way to store mouse position and button states.

- Add a event listener for mousemove, mousedown, mouseup and convert the client coordinates into screen coordinates and store the button states respectively. (You need to take the canvas scale into account!):

var mouseX = e.clientX * (canvas.width / canvas.offsetWidth);
var mouseY = e.clientY * (canvas.height / canvas.offsetHeight);

- In your render loop, you convert the mouse coordinates into world coordinates and calculate the tile position for the current mouse position (Its a simple divide by the tile size) and draw rectangle by the tile position multiplied by the tile size (You may need to take camera translation and scale into account as well)

- At this point you have all tools you need to make your own tilemap editor.


You need some reference, here is one:


Edited by Finalspace

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Advertisement