Javascript 如何在图像中插入输入文本？

我想开发magento的扩展，这有助于创建定制t恤，但我不知道怎么做。我想提供像这个网站死链接这样的功能

---

在这里输入名称，然后名称自动插入到图像中。我想准确地提供这一点，但没有得到正确的答案。您只需使用

var canvas=document.createElement（'canvas'），
ctx=canvas.getContext（'2d'）；
画布宽度=200；
画布高度=200；
document.body.appendChild（画布）；
发送至CAN VAS（ob）的功能{
var img=新图像（）；
img.addEventListener（'load'，function（）{
ctx.drawImage（img，0，0，canvas.width，canvas.height）；
ctx.font=ob.fontWeight+''+ob.fontSize+''+ob.fontFamily；
ctx.textAlign='中心'；
ctx.fillStyle=ob.color；
ctx.fillText（ob.text，canvas.width/2，canvas.height/2.5）；
});
img.src=ob.image；
}
//默认值
var cvsObj={
文本：“堆栈溢出”，
图像：“http://i.imgur.com/hqayV16.jpg",
方特家族：“Arial”，
fontWeight：“粗体”，
字体大小：“90%”，
颜色：“rgba（244、128、36、0.7）”
};
sendToCanvas（cvsObj）；//在init上发送默认数据
document.getElementById（“text”）.addEventListener（“输入”，函数（）{
cvsObj.text=this.value；//修改cvsObj text
sendToCanvas（cvsObj）；//在输入时发送自定义数据
});

---

Text:

这是通过服务器端图像处理完成的，而不是jquery在图像上方（顶部）放置一个位置是否足够？至少对于初学者来说……我不清楚服务器端图像处理这是什么意思，这与我想要的不同，我想要与给定站点中提供的功能完全相同的功能。我想要将背景大小和背景位置添加到图像中，因为它已在画布中裁剪。我在sendToCanvas数组中添加了样式，但它不起作用。请帮忙@尼山帮你做什么？有人知道如何设置背景颜色而不是源图像吗？@thobiash你的意思是改变T恤的颜色？