JSFiddle - React, Tailwind, and code Playground

by soulwire

JavaScript

var w = 190;
var h = 190;
var n = 38;

var svg = '<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" ';
svg += 'width="' + (w*n) + 'px" height="' + h + 'px" viewBox="0 0 ' + (w*n) + ' ' + h + '">';
for ( var i = 0; i < n; i++ ) {
    svg += '<g transform="translate(' + ( i * w ) + ' 0)">';
    svg += '\n<rect stroke="#000" fill="none" x="0" y="0" width="' + w + '" height="' + h + '"/>';
    svg += '\n<text size="30" fill="#000" x="' + (w/2) + '" y="' + (h/2) + '" text-anchor="middle" dominant-baseline="central">' + i + '</text>';
    svg += '</g>';
}
svg += '\</svg>';
document.body.innerHTML = svg;
console.log(svg);