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

Question

我挤出一个网络插座到网页Base64编码的PNG，我显示使用数据URI

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

有没有办法在JavaScript或一些口味来调整我收到到图像相当于一个较小的base64数据URI，以便能够生成给定图像的缩略图版本？

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

如果能在JavaScript上做客户端，我可以避开另一个HTTP请求到我的服务器守护程序，这将需要一些时间来重新处理和传递调整后的图像。

Answer 1

您可以克隆图像与jQuery，并作为调整 - HTML元素的也许微不足道的改变宽度和高度？

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

Answer 2

的maxImage插件声称能够调整图像。 TMMV，我自己没有尝试过。

Answer 3

Pixastic库会做到这一点，即使在移动设备上，它的工作速度也非常快。

尝试成才，如：

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

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