javascript / html5 - 文字转图片

Question

I need help for converting one text to image. Is there any way to do this by js or jquery.. ?

any help would be appreciated.

Answer 1

Use canvas and print the text on the canvas. After that canvas can be exported to an image.

<canvas id="e" width="200" height="200"></canvas>
<script>
  var canvas = document.getElementById("e");
  var context = canvas.getContext("2d");
  context.fillStyle = "blue";
  context.font = "bold 16px Arial";
  context.fillText("Your text", 100, 100);
</script>

Answer 2

Draw your text into a canvas tag.

var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');

ctx.fillText(myText, x, y);

Answer 3

There is a library that attempts to do this.

http://hertzen.com/experiments/jsfeedback/

Reads the DOM, from the html and render it to a canvas, fail on some, but in general works.

Answer 4

I suggest you use puppeteer with ejs for better speed. I used it and got like 80 MS speed (average), which is way faster than canvas or any other lib, If you want to use it. feel free to let me know.