将Div内容或画布保存为图像

One*_*erd 2 javascript php canvas image

我已经阅读了一些类似的问题和答案,但没有一个完全解决我的问题.

这里是我的情况: 我有什么类似于TinyMCE的(一个家庭BREW版本虽然)一种编辑器.它允许用户输入一些文本,一个或两个图像等.我有代码,它将项目放在那里,并将它们实时渲染成一个较小的div(基本上是一个缩略图).

这就是我想要做的事情 最终,用户可能想在其他地方使用他们的"页面",所以我想让他们去屏幕,查看每个页面的缩略图,然后选择一个.

这是问题 显然,我可以使用相同的缩略图代码来渲染每个页面缩略图.但是,它可能是带宽密集型的(每个页面可能有多个图像,更不用说计算必须多次执行 - 我们在预览页面上可能会说40到50个缩略图).

所以,我想尝试使用缩略图div,并以某种方式创建一个png或jpg,当他们在编辑器中保存页面时(所以页面的代码,也是缩略图),并将其推送到我的PHP脚本将图像保存到服务器.

我的第一个想法是,也许画布可以做到这一点,但是存在将文本和图像首先翻译到画布上的问题,这可能是也可能是不可能的.

就是这样.我对任何和所有选项感兴趣,包括商业图书馆(如果有的话)会这样做 - 唯一的事情是,希望它是在javascript中.