HTML5 / JavaScript代码从模板创建自定义图片

Question

基本上，像picfont这样的网站如何工作？ 还是那些拥有模板并在其中将图片插入框架并在文本框中添加文字并对其进行样式化的蛋糕设计网站？

我有一个节目的邀请广告，人们在此张贴自己的照片和名字并发出个人邀请。 因此，图形人员已经完成了模板。 我知道可以将模板放到网页上，然后让人们上传图片，进行一些自定义编辑和样式化，而不是让1000个人将其照片和姓名发送给他。 请问我该怎么做？ 我想要一些可以实现的指针或代码。 谢谢。

Answer 1

如前所述，您将需要<Canvas>元素，但这也需要一些自定义开发。

我自由地创造了一个良好的起点： https : //jsfiddle.net/Zomry/f8to2fyq/11/

此演示加载背景图像，可以插入自定义图像（此处假定为正方形）并允许自定义文本的位置。

您可以将此示例更改为任何您喜欢的示例。 您将需要更改背景，文本和背景的位置以及您要更改的内容。

祝您项目顺利。