Как сделать web страницу с генератором картинки?

Question

[ArtJH]

Выбираешь фон(картинку), вводишь тайтл, и потом можно скачать эту новую картинку с тайтлом. Буду делать на vue скорее всего, либо js c jquery. Как это сделать? можно примеры кода, или как нибудь направить

Comments

[FeST1VaL]

эм... т.е вы вводите текст и накладываете текст на картинку и сохраняете картинку? и это без бэкенда?

Answer 1

[Преподаватель программирования]

это можно сделать на Canvas
у него есть экспорт картинки в виде dataURL

Answer 2

[heavenst]

Обычно подобные операции с картинками делаются на сервере с помощью ImageMagick и т.д., это лучший вариант.
А реализовать такое целиком на фронтенде можно попробовать с помощью API внешних сервисов обработки изображений:
www.blitline.com/docs/quickstart
https://cloudinary.com
https://www.imgix.com/
У всех есть бесплатные тарифные планы для разработчиков.

Comments

[profesor08]

на сервере с помощью ImageMagick и т.д., это лучший вариант

Чушь же. На canvas можно сделать и нарисовать все, а потом получить картинку в виде dataURL и делать с ней что хочешь.

Answer 3

[profesor08]

https://www.w3schools.com/graphics/canvas_text.asp
https://www.w3schools.com/tags/canvas_drawimage.asp

Тебе останется совместить