Using the package node-canvas, I need to render a username - one that can be rather large. I need to ensure that the text can dynamically scale the size of it to fit into a pre-defined image, so that the name is never cut off, it just gets smaller so more characters can be rendered. I have considered using jimp and sharp, but couldn't find the optimal outcome.
Thanks.
There are different types of units in HTML / CSS, which can be absolute, or relative. CSS EM, PX, PT, CM, IN…
Ex, if you use "10px" as a default font height, it will look the same on any screen size, but if you use "10vw", the height will change with the width of the window.
You can also use "%" for the same effect, which usually relates to the size of the parent element.
But the best option is to create an event function that changes the width of the font based on the canvas size so that the font never gets too big or too small.