Skip to content

Instantly share code, notes, and snippets.

@hustcc
Last active December 5, 2016 02:23
Show Gist options
  • Save hustcc/08e22766b832b93455100c663a3dbc13 to your computer and use it in GitHub Desktop.
Save hustcc/08e22766b832b93455100c663a3dbc13 to your computer and use it in GitHub Desktop.
var canvas = document.getElementById('canv'),
ctx = canvas.getContext('2d'),
img = document.getElementById('image');
function grow(el) {
el.style.height = "10rem";
el.style.height = (el.scrollHeight)+"px";
}
var generate = function() {
var text = document.getElementById('text').value.split("\n").join("\n");
var x = 12.5;
var y = 15;
var lineheight = 30;
var lines = text.split('\n');
var lineLengthOrder = lines.slice(0).sort(function(a, b) {
return b.length - a.length;
});
ctx.canvas.width = ctx.measureText(lineLengthOrder[0]).width + 25;
ctx.canvas.height = (lines.length * lineheight);
ctx.fillStyle = "#232323";
ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.textBaseline = "middle";
ctx.font="20px Anonymous Pro";
ctx.fillStyle = "#BBBBBB";
for (var i = 0; i<lines.length; i++)
ctx.fillText(lines[i], x, y + (i*lineheight) );
img.src = ctx.canvas.toDataURL();
}
document.getElementById('submit').addEventListener('click', function (){
document.getElementById("image").style.display = 'block';
generate();
});
generate();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment