如何使用javascript调整Base64编码的数据URI PNG的大小？

Question

我将一个Base64编码的PNG从Web套接字中挤出到一个网页中，我使用数据URI显示

    <img src="data:image/png;base64, --base64 png-- ">

有没有办法在javascript或它的某些风格中将我收到的图像调整为较小的base64数据URI等效，以便在动态生成给定图像的缩略图版本？

或许我可以复制HTML Image对象并使用它作为一个整体来玩，使用一些我还没有找到的模糊jQuery魔术技巧。

如果这可以在客户端的javascript中完成，我可以避免对我的服务器deamon的另一个HTTP请求，这将需要一些时间来重新处理和传递调整大小的图像。

Answer 1

您可以使用jQuery克隆图像，以及调整大小 - 可能会更改html元素的宽度和高度？

$('.somewhere img').clone().appendTo('.elsewhere').width(16).height(16)

Answer 2

Pixastic库可以做到这一点，即使在移动设备上也能以惊人的速度运行。

尝试类似：

    Pixastic.process(image, "resize", { "width" : 200, "height" : 200 }, function (oCanvas){ //callback code here});

我挣扎的事实是你给它一个图像然后它返回一个画布，花了我几个星期来了解发生了什么！ 现在我使用Canvas2Image，我在网络上的某个地方找到了回到图像。

Answer 3

maxImage插件声称可以调整图片大小。 TMMV，我自己没试过。