How to print pattern like this using canvas tag (using JavaScript) . Pls help me.

Question

*
**
***
****

Answer 1

Krishna Teja , but why do you need to use the canvas tag to do this?

And if you really want it, then try to use fillText or strokeText, along with a prompt input (or however you would like to take input) for the number of lines to print and use logic to print the pattern!

I'll soon share an example code...

Answer 2

Here is the code solution:

https://code.sololearn.com/WTPWgW7oAY03/?ref=app

Note that in canvas' fillText or strokeText, you cannot use the new line character '\n'. So what I did is that I configured the for loop in such a manner so as to increase the y-coordinate of the text box for each new line by 20. In this way, every pair of adjacent lines has a gap of almost 20, which appears like a new line.

Answer 3

Santanu Sikder [DM glitched] yes!! ctx.fillText(pattern, 100, 100 + i * 20)
This is the part in ur code , which iam missing. Thank u so much :)

Answer 4

𝐊𝐢𝐢𝐛𝐨 𝐆𝐡𝐚𝐲𝐚𝐥 Actually i missed that logic to increase y coordinates over there.
thank u so much for ur suggestions