image - Canvas - 图像调整大小并复制到另一个

Question

是否有 jQuery 插件或代码可以用来调整图像(或 Canvas (带有此图像))的大小并将其复制到另一个图像(或 Canvas )中？图片 #2 是一个

编辑:想法:也许利用-moz-transform: scale(sx, sy)/-webkit-transform: scale(sx, sy)？或者这个Resizing an image in an HTML5 canvas

Answer 1

您可以轻松调整图像或 Canvas 的大小并将其复制到另一个 Canvas 中。

context.drawImage(image, dx, dy, dw, dh)允许您在绘制时调整要绘制的任何图像(或 Canvas )的大小。

您可以将 100x100 的图像绘制为 50x50 或 200x200。

另外还有context.drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh)如果您只想绘制原始图像的一部分。

您希望绘制的图像可以调整大小和移动吗？这完全是另一回事，这样的功能至少没有内置到 Canvas 中，这意味着您必须自己制作它。我写了一个关于获取 resizable, movable objects in the canvas 的小教程，这是一个很好的起点。