在javascript中创建图像的一部分[重复]答案

【问题标题】：Create part of an image in javascript [duplicate]在javascript中创建图像的一部分[重复]
【发布时间】：2015-09-08 21:48:09
【问题描述】：

我想在 java 脚本中提取图像的一部分并将其制成新图像，例如：

var image2 = new Image(); image2.src = image1.src(10,10)

显然上面的东西是行不通的，但是什么会？，例子很感激，

编辑：我想在绘制之前对其进行裁剪

谢谢。

【问题讨论】：

getting part of an image with javascript的可能重复
阅读 MDN 上的 Canvas 文档，我相信您会发现一个看起来像是在其中绘制部分图像的函数。
我的问题是制作一个图像变量，它是图像的一部分，所以我不必在画布中裁剪它
你已经在这里解释了这一切：stackoverflow.com/questions/25463416/…（只需进行一些调整，您就可以将组织图像的所需部分检索为单独的图像）
是的，您可以在绘制之前对其进行裁剪。用new Image()创建一个图片对象，设置来源，图片加载后，可以用drawImage来绘制一部分。

标签： javascript html canvas html5-canvas

【解决方案1】：

如何制作另一个图像。

// img1 is the first img    
var canvas = document.createElement("canvas"); 
canvas.width = 10;  // size of new image
canvas.height = 10;
var ctx = canvas.getContext("2d");      // get the context
// draw part of the first image onto the new canvas
ctx.drawImage(img1,0,0,10,10,0,0,10,10);            
// create a new image    
var imgNew = new Image();
// set the src from the canvas 
imgNew.src = canvas.toDataURL();

【讨论】：

这是一个重复的问题，但仍然要投赞成票，因为您给出了重复答案的简洁明了的版本。