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.
Javascript, HTML, CSS Code
<!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/5582/"> <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; let placedObjectives = []; 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(objectiveCount < objectives) { let tooClose = false; for(const [x, y] of placedObjectives) { if(Math.abs(x - i) <= 1 && Math.abs(y - j) <= 1) { tooClose = true; break; } } if(!tooClose && Math.random() < 0.1) { cell.classList.add('objective'); placedObjectives.push([i, j]); 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>
Warhammer 40k Tabletop Grid Map Overview Generator
Calculator Tools