https://github.com/dedetheprogrammer/hexagonal-map-generator

A hexagonal map generator made with OpenCV and JavaScript.
https://github.com/dedetheprogrammer/hexagonal-map-generator

hexagonal-grids hexagonal-tiles html javascript opencv opencvjs

Last synced: 9 months ago
JSON representation

A hexagonal map generator made with OpenCV and JavaScript.

• Host: GitHub
• URL: https://github.com/dedetheprogrammer/hexagonal-map-generator
• Owner: dedetheprogrammer
• Created: 2025-02-12T14:31:03.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2025-02-20T13:33:27.000Z (11 months ago)
• Last Synced: 2025-02-20T14:32:10.159Z (11 months ago)
• Topics: hexagonal-grids, hexagonal-tiles, html, javascript, opencv, opencvjs
• Language: JavaScript
• Homepage: https://dedetheprogrammer.github.io/hexagonal-map-generator/
• Size: 848 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Hexagonal map generator

A hexagonal map generator made with OpenCV 4.x and JavaScript available from browser.

## Hexagonal map and parameters

You can generate a simple hexagonal map with different parameters that make the map generation more interesting:

- **Orientation**: The orientation of the hexagons, either _Flat top_ or _Pointy top_.

- **Distance**: The maximum Manhattan distance from the center.

- **Size**: The size of the hexagons in the given unit.

- **Random Walk**: Probability of movement—lower values increase randomness.

- **Media**: I'll save this for the next section.

![hexagonal_map_generator_1](https://github.com/user-attachments/assets/dfc21001-73f9-4392-babb-f680dbc1e93d)

## Hexagonal map generation with a drawing or an outline.

If you're bored of generating simple hexagonal maps, you can also draw your own outline or download one from the internet and upload it.

This is where OpenCV comes in—with a bit of magic, it detects the contours of your image and generates the map only within those boundaries. The parameters will also affect the final result.

![hexagonal_map_generator_2](https://github.com/user-attachments/assets/bfe6ba2c-c545-4f60-94b4-4b4a18a12e76)

## Hexagonal map generation with a video

If you're **really** bored, you can simply provide a video and watch the visual effects this generator creates. The parameters will affect the result in real-time, but you won't be able to save the output.

![hexagonal_map_generator_3](https://github.com/user-attachments/assets/d74769b9-9e41-486f-84f2-3a4b10839bf4)

## Missing features

- [ ] Save the result as a JSON file.

- [ ] Detect and consider internal contours (e.g., representing holes).

- [ ] Save the result as an image.

- [ ] Save the result as a video.

- [ ] Improve responsiveness.

- [ ] Port the project to other languages:

  - [ ] Python.

  - [ ] C++ (could make a plug-in to use it in Unity and Godot).