Skip to content

kaxiii/hex-tiles-map

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Hexagonal Grid Map

Overview

This project features an interactive hexagonal grid map built with HTML, CSS, and JavaScript (jQuery). The map allows users to navigate through a large grid of hexagons, each displaying its unique coordinates. Users can select individual hexagons by clicking on them, and only one hexagon can be selected at a time. The map also supports mouse dragging and keyboard navigation (WASD keys) for seamless movement, along with zoom functionality.

Features

  • Hexagonal Grid Layout: Dynamic generation of hexagonal cells that fill a specified area.
  • Hexagon Selection: Click to select a hexagon. Clicking again on the selected hexagon will deselect it.
  • Mouse Dragging: Click and drag to move the map around.
  • Keyboard Navigation: Use the W, A, S, and D keys to move the map in all directions.
  • Zoom Functionality: Scroll with the mouse wheel to zoom in and out of the map.
  • Non-selectable Text: Hexagon numbers cannot be selected, enhancing user experience.

Installation

  1. Clone this repository to your local machine:
    git clone https://github.com/kaxiii/hexagonal-grid-map.git