JSFiddle - React, Tailwind, and code Playground

by Drath

HTML

<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>

<body>
<canvas id="test" width="400" height="400"></canvas>
</body>
</html>

JavaScript

map = [];
map.push(25, 2, 2, 2, 3, 3, 3, 2, 3, 2, 2, 2, 3, 3, 2, 2, 2, 3, 3, 2, 2, 2, 3, 3, 3, 3, 3, 3, 2, 2, 3, 3, 2, 3, 2, 2, 3, 2, 2, 2, 3, 2, 2, 2, 2, 3, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 2, 3, 3, 3, 3, 2, 2, 2, 2, 2, 3, 2, 3, 2, 2, 3, 2, 3, 2, 2, 3, 3, 2, 2, 3, 1, 3, 3, 2, 3, 2, 2, 3, 2, 2, 3, 3, 2, 3, 1, 2, 2, 2, 2, 2, 3, 2, 3, 2, 3, 1, 1, 1, 3, 1, 1, 2, 2, 3, 3, 2, 2, 1, 1, 1, 2, 2, 3, 3, 2, 2, 3, 2, 3, 1, 1, 1, 1, 1, 1, 1, 3, 1, 2, 3, 1, 1, 1, 1, 1, 3, 2, 2, 2, 2, 2, 3, 2, 2, 1, 1, 1, 1, 1, 1, 2, 2, 1, 1, 1, 1, 1, 1, 1, 3, 2, 3, 2, 2, 2, 2, 3, 3, 2, 1, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 3, 2, 3, 2, 3, 3, 2, 2, 2, 1, 1, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 1, 1, 3, 3, 2, 3, 3, 3, 3, 3, 3, 3, 3, 3, 1, 1, 1, 1, 3, 2, 1, 1, 1, 1, 1, 1, 1, 1, 3, 3, 2, 3, 2, 3, 3, 3, 2, 2, 1, 1, 1, 1, 1, 1, 3, 3, 1, 1, 1, 1, 2, 1, 1, 1, 2, 2, 3, 3, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 1, 1, 1, 3, 3, 1, 1, 1, 3, 3, 2, 2, 2, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 2, 2, 1, 3, 3, 3, 3, 1, 1, 2, 2, 3, 3, 3, 3, 2, 3, 3, 1, 1, 1, 1, 1, 1, 1, 1, 3, 2, 3, 2, 3, 2, 1, 1, 3, 3, 3, 3, 2, 2, 3, 3, 3, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 2, 3, 2, 3, 3, 1, 1, 3, 2, 3, 2, 2, 3, 3, 3, 2, 1, 1, 1, 2, 1, 1, 1, 1, 1, 1, 3, 3, 2, 3, 3, 2, 3, 3, 2, 3, 3, 2, 3, 1, 1, 1, 1, 2, 2, 2, 3, 2, 2, 1, 1, 1, 2, 3, 3, 3, 3, 2, 3, 3, 2, 2, 2, 3, 1, 1, 1, 3, 3, 2, 2, 3, 2, 3, 2, 1, 1, 1, 3, 2, 2, 3, 2, 3, 2, 2, 3, 3, 2, 2, 1, 1, 1, 3, 2, 2, 3, 3, 3, 2, 1, 1, 1, 2, 3, 3, 3, 2, 3, 2, 2, 3, 2, 2, 3, 1, 1, 2, 1, 3, 3, 2, 2, 2, 3, 3, 1, 2, 2, 2, 2, 2, 2, 2, 2, 3, 2, 2, 2, 2, 3, 1, 1, 2, 3, 2, 3, 3, 3, 3, 2, 3, 3, 1, 1, 2, 3, 2, 3, 2, 3, 2, 3, 3, 2, 2, 3, 1, 3, 1, 3, 2, 2, 2, 2, 2, 1, 3, 3, 2, 2, 2, 2, 3, 3, 3, 2, 2, 3, 2, 3, 1, 2, 3, 2, 2, 2, 3, 2, 3, 2, 2, 2, 2, 3, 1, 3, 2, 2, 2, 2, 2, 2, 3, 2, 2, 3, 2, 3, 2, 3, 2, 3, 3, 2, 2, 2, 2, 2, 2, 3, 2, 2, 2, 3, 2, 2, 3, 2, 2, 2, 3, 3, 3, 2, 2, 2, 3, 2, 2, 2, 2, 2, 2, 3, 2, 3, 3);
canvas = document.getElementById('test');
ctx = canvas.getContext('2d');
tiles = new Image();
var...