JSFiddle - React, Tailwind, and code Playground

by Leonid Artemev

HTML

<script src="http://site.ptdev.multivi.ru/app/scripts/rasterizeHtml.js"></script>
<!--canvas id="canvas" width="600" height="600" style="border: 1px solid black;"></canvas-->
<div id="thehtml">
    <div style="text-align: center; color: rgb(140, 198, 63); font-family: Arial; font-size: 14px; width: 387px; overflow: hidden; display: inline-block; word-wrap: break-word;">gffffffffffffffffffffffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklkfffffffd<i><span style="text-decoration: underline;">dddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</span></i>ddddklk
        <br>lnknkddd
        </div>
</div>

JavaScript

//var canvas = document.getElementById("canvas");
//var context = canvas.getContext('2d');
var html_container = document.getElementById("thehtml");
var html = html_container.innerHTML;

rasterizeHTML.drawHTML(html, null, {
    width: 387,
    height: 256
}).then(function (renderResult) {
    //context.drawImage(renderResult.image, 10, 25);
    document.body.appendChild(renderResult.image);
});