How to create a ready-made algorithm for creating a picture with text?

Question

JavaScript

How to create a ready-made algorithm for creating a picture with text?
For example, I wrote a certain text in a certain form and it was inserted into the picture
https://www.youtube.com/watch?v=LkbGUVfzCKc
look

Answer 1

Using Canvas API.
Documentation
Habré article "Displaying text on HTML5 Canvas"

Answer 2

Take and create a ready-made algorithm. What is the difficulty? Here's an example for you:

1. Take a picture;
   
2. Insert picture;
   
3. Take text;
   
4. Insert text into picture.
   

Answer 3

Can it be like this

Answer 4

Background option
https://jsfiddle.net/Stalk/gwyfz2y4/