HTML5 Procedural Hexagon Terrain Generator
A basic and customizable procedural hexagon terrain generator made in Javascript.
Demo
You can see the generator working at the Demo Page.
Also, you can play with a more visual appealing Tiled version of this terrain generator.
HexGrid Settings
- Edge size
- Orientation (flat, pointy)
- Number of hexes (columns,rows)
- Show / hide coordinates
- Show / hide grid border
- Line Thickness
- Contour Interval
- Terrain Archetype
- Deep Water
- Shallow Water
- Flat
- Hill
- Mountain
- Mountain Impassable
- Terrain Archetype
Elevation Noise
- Seed
- Frequency
- Redistribution
- Octaves
- Islands
Moisture Noise
- Seed
- Frequency
- Redistribution
- Octaves
- No draw moisture
Biomes
- Water
- Flat
- Desert
- Grassland
- Forest
- Hill
- Desert
- Grassland
- Mixed Forest
- Needleleaf Forest
- Mountain
- Desert
- Shrubland
- Alpine Forest
- Mountain Impassable
- Snow
Map Seed
Copy to save the map setings and restore.
Viewport
- Drag
- Wheel Zoom
- Bounce
- Hex Info on click: Coordinates, elevation, moisture, terrain and biome.
Export as PNG
Actually you can export the terrain generated to png.
Libraries
- Honeycomb v3.1.0
- PixiJS v5.1.5
- pixi-viewport v4.3.3
- reimg
- Bootstrap v4.3.1
- simplex-noise.js v2.4.0