battle-map-explorer

KO | EN

gitlite — search

#python #hacktoberfest #react #golang #android #deep-learning #macos #awesome #kubernetes #security #ios #openai #mcp #open-source

battle-map-explorer

(★ 52)

Create maps for D&D and other tabletop RPGs. Improved map exploration by hiding undiscovered rooms until they're entered.

battle-map-explorer Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# battle-map-explorer

## Example Maps

**Halmond's Laboratory**: [http://www.byronknoll.com/dungeon.html](http://www.byronknoll.com/dungeon.html)<br>
Navigate using arrow keys, mouse drag, or touch. Zoom in/out using your browser's zoom tool. This map is used with the [author](https://www.reddit.com/r/battlemaps/comments/2ep3j7/the_experiments_of_a_madman_halmonds_laboratory/)'s permission.

**Salt Hall**: [http://www.byronknoll.com/dungeon2.html](http://www.byronknoll.com/dungeon2.html)<br>
This map was created by Daniel Somerville and used with his permission. You can find this map and more at his [DeviantArt gallery](http://dasomerville.deviantart.com/gallery/53876770/Fantasy-Cartography).

## Description
This is a library to help you create maps for D&D and other tabletop RPGs. It uses JavaScript and HTML5 canvas. Look at [battle-map-explorer-dev.js](https://github.com/byronknoll/battle-map-explorer/blob/master/battle-map-explorer-dev.js) and [example-map.html](https://github.com/byronknoll/battle-map-explorer/blob/master/example-map.html) to get started. The maps should work across all modern web browsers, operating systems, smart phones, and tablets.

Creating a map involves manually tracing the coordinates of walls and obstacles. The coordinates match the pixel positions of the background image (with the origin in the top-left). One way to find the coordinates is to load an image using this library (without any walls), navigate to a place you want to record, and press 'space'. This will log the coordinates at the crosshair into your browser's developer console. You can press '/' to adjust the movement speed to help fine-tune coordinates.

This project uses two external JavaScript libraries: [visibility-polygon-js](https://github.com/byronknoll/visibility-polygon-js) and [hammer.js](https://github.com/hammerjs/hammer.js/).

Contact me at byron@byronknoll.com if you have any questions or feature requests.

battle-map-explorer

battle-map-explorer Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

battle-map-explorer

battle-map-explorer Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README