Warhammer 40k Tabletop Grid Map Overview Generator
Info
Created On: September 3, 2023
Created By:
AI
Model: chatgpt-plugin
Time: 0 seconds
Prompt Tokens: 0
Completion Tokens: 0
Total Token Cost: 0
Get This App On Your Website
Copy Code
1. Copy the code above with the iframe and link.
2. Paste the code into your website.
3. Resize the iframe to fit your website.
Javascript, HTML, CSS Code
Copy
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"> window.addEventListener('error', function(event) { var message = JSON.parse(JSON.stringify(event.message)); var source = event.filename; var lineno = event.lineno; var colno = event.colno; var error = event.error; window.parent.postMessage({ type: 'iframeError', details: { message: message, source: source, lineno: lineno, colno: colno, error: error ? error.stack : '' } }, '*'); }); window.addEventListener('unhandledrejection', function(event) { window.parent.postMessage({ type: 'iframePromiseRejection', details: { reason: event.reason } }, '*'); }); </script>
<title>Warhammer 40k Tabletop Grid Map Overview Generator</title>
<meta name="description" content="Generate a Warhammer 40k tabletop grid map overview.">
<meta name="keywords" content="Warhammer 40k, tabletop, grid map, generator">
<style>
#grid {
display: grid;
grid-template-columns: repeat(6, 50px);
grid-gap: 5px;
}
.cell {
width: 50px;
height: 50px;
border: 1px solid black;
}
.terrain {
background-color: grey;
}
.objective {
background-color: red;
}
</style>
<link rel="canonical" href="https://calculator.tools/prompt/5581/">
<meta charset="utf-8">
</head>
<body>
<h1>Warhammer 40k Tabletop Grid Map Overview Generator</h1>
<label for="size">Select Map Size:</label>
<select id="size" onchange="generateGrid()">
<option value="small">Small</option>
<option value="medium">Medium</option>
<option value="large">Large</option>
<option value="huge">Huge</option>
</select>
<label for="objectives">Select Number of Objective Markers:</label>
<select id="objectives" onchange="generateGrid()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</select>
<button onclick="generateGrid()">Random Generate</button>
<div id="grid">
</div>
<script>
function generateGrid() {
const size = document.getElementById('size').value;
const objectives = parseInt(document.getElementById('objectives').value);
let rows, cols;
switch(size) {
case 'small':
rows = 6;
cols = 6;
break;
case 'medium':
rows = 8;
cols = 8;
break;
case 'large':
rows = 10;
cols = 10;
break;
case 'huge':
rows = 12;
cols = 12;
break;
}
const grid = document.getElementById('grid');
grid.innerHTML = '';
grid.style.gridTemplateColumns = `repeat(${cols}, 50px)`;
let objectiveCount = 0;
for(let i = 0; i < rows; i++) {
for(let j = 0; j < cols; j++) {
const cell = document.createElement('div');
cell.className = 'cell';
if(i !== 0 && i !== rows - 1 && j !== 0 && j !== cols - 1) {
if(Math.random() < 0.2) {
cell.classList.add('terrain');
}
if(Math.random() < 0.1 && objectiveCount < objectives) {
cell.classList.add('objective');
objectiveCount++;
}
}
grid.appendChild(cell);
}
}
}
generateGrid();
</script>
<script type="text/javascript"> var localStoragePrefix = "ct-{{ cachebreaker }}"; var lastSave = 0; function saveLocal(data) { if (Date.now() - lastSave < 1000) { return; } let cookie = localStoragePrefix + "=" + JSON.stringify(data) + "; path=" + window.location.pathname + "'; SameSite=Strict"; cookie += "; expires=" + new Date(Date.now() + 1000 * 60 * 60 * 24 * 365 * 1000).toUTCString(); document.cookie = cookie; lastSave = Date.now(); } function loadLocal() { var cookiePrefix = localStoragePrefix + "="; var cookieStart = document.cookie.indexOf(cookiePrefix); if (cookieStart > -1) { let cookieEnd = document.cookie.indexOf(";", cookieStart); if (cookieEnd == -1) { cookieEnd = document.cookie.length; } var cookieData = document.cookie.substring(cookieStart + cookiePrefix.length, cookieEnd); return JSON.parse(cookieData); } } </script>
<script type="text/javascript"> window.addEventListener('load', function() { var observer = new MutationObserver(function() { window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); observer.observe(document.body, {attributes: true, childList: true, subtree: true}); window.parent.postMessage({height: document.documentElement.scrollHeight || document.body.scrollHeight},"*"); }); </script>
</body>
</html>