如何使用javascript调整Base64编码的数据URI PNG的大小？ [英] How to resize a Base64 encoded Data URI PNG using javascript?

问题描述

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

I have a Base64 encoded PNG squeezed out of a web socket into a web page, that I display using Data URI

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

有没有办法在javascript或它的一些风格中调整我收到的图像到一个较小的base64数据URI等价，以dinamically生成给定图像的缩略图版本？

Is there a way in javascript or some of its flavours to resize the image I receive into a smaller base64 data URI equivalent, as to dinamically generate a thumbnail version of the given image?

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

Or maybe I could just duplicate the HTML Image object and play with it as a whole, using some obscure jQuery magic trick that I haven't find out yet.

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

If this can be done in javascript on client side, I could avoid another HTTP request to my server deamon, which would take some time to reprocess and deliver the resized image.

推荐答案

您可以使用jQuery克隆图像，以及调整大小 - 也许是微不足道的改变html元素的宽度和高度？

You can clone image with jQuery, and as for resizing - maybe trivial changing width and height of html element?

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

这篇关于如何使用javascript调整Base64编码的数据URI PNG的大小？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！