<!DOCTYPE html> <html> <body> <canvas id="cityCanvas" width="400" height="400" style="border:1px solid #000;"></canvas> <script> const canvas = document.getElementById('cityCanvas'); const ctx = canvas.getContext('2d'); const gridSize = 40; canvas.addEventListener('click', (e) => { const x = Math.floor(e.offsetX / gridSize) * gridSize; const y = Math.floor(e.offsetY / gridSize) * gridSize; ctx.fillStyle = 'brown'; // घर का रंग ctx.fillRect(x + 5, y + 5, 30, 30); ctx.fillStyle = 'red'; // छत का रंग ctx.fillText("🏠", x + 10, y + 25); }); // ग्रिड बनाना ctx.strokeStyle = '#ddd'; for(let i=0; i<400; i+=gridSize) { for(let j=0; j<400; j+=gridSize) { ctx.strokeRect(i, j, gridSize, gridSize); } } </script> <p>कैनवस पर कहीं भी क्लिक करके <b>घर बनाएं</b>।</p> </body> </html> #411
Description
No description provided.